Conversation
…cking and optimize message fetching
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
This PR refactors messaging to better track incoming socket messages and trigger conversation refreshes, while also tightening authentication redirects and adjusting platform data fetching behavior.
Changes:
- Added
latestIncomingMessageto the chat Redux slice and dispatch it on incoming socket messages;ChatWindownow refetches messages when a new message arrives for the active conversation. - Updated
DashboardLayoutto redirect unauthenticated users to/auth/signinwhen no saved token and no Redux token are present. - Adjusted API/socket infrastructure (Axios timeout + error code exposure, socket URL change) and refactored platform data hooks with placeholder behavior and commented-out UI/animations.
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| src/store/slices/chatSlice.ts | Adds latestIncomingMessage field + setter action to Redux chat state. |
| src/hooks/features/useChatSocket.ts | Dispatches setLatestIncomingMessage on inbound (non-self) messages. |
| src/app/messages/components/ChatWindow.tsx | Adds fetchMessages callback and refetches when latestIncomingMessage matches the active conversation. |
| src/components/layout/Dashboard/Dashboard.tsx | Redirects to sign-in when no token exists (localStorage + Redux). |
| src/hooks/features/usePlatformData.ts | Refactors hooks; single-platform hook currently returns placeholder data instead of fetching. |
| src/components/profile/PlatformUsernameInput.tsx | Disables blur guard + comments out status/preview animations (temporary UI changes). |
| src/lib/api/client.ts | Adds Axios timeout and includes error.code in normalized errors. |
| src/lib/socket/events.ts | Changes socket base URL (currently hardcoded). |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| console.log(`✅ Successfully fetched ${platform} data:`); | ||
| setData({ | ||
| platform: platform, | ||
| username: username, | ||
| displayName: username, // Placeholder - replace with actual display name from API | ||
| profileImage: "string", |
There was a problem hiding this comment.
usePlatformData no longer performs any network request and unconditionally sets placeholder UnifiedPlatformData (e.g., verified: true, profileImage: "string"). This will make username validation always succeed and can lead to incorrect UI/logic downstream. Please restore the real fetch (or gate placeholder behavior behind an explicit dev flag) and ensure the hook returns an error/null data when the username can’t be verified.
| const handleBlur = () => { | ||
| if (validateOnBlur && value.trim()) { | ||
| // if (validateOnBlur && value.trim()) { | ||
| setShouldValidate(true); | ||
| } | ||
| // } | ||
| }; |
There was a problem hiding this comment.
handleBlur currently ignores validateOnBlur and whether the input is non-empty, because the guard is commented out. This changes behavior for callers that pass validateOnBlur={false} and also triggers validation state even when the field is blank. Please restore the conditional (or implement an equivalent) so validation only enables when intended.
| {/* Status message */} | ||
| <AnimatePresence mode="wait"> | ||
| {/* <AnimatePresence mode="wait"> | ||
| {shouldValidate && getStatusMessage() && ( | ||
| <motion.div | ||
| initial={{ opacity: 0, y: -5 }} |
There was a problem hiding this comment.
Large UI blocks (status message + preview card) are commented out in JSX. Keeping dead/commented UI in production code reduces maintainability and also tends to create unused imports/props over time. Prefer either re-enabling these blocks, removing them entirely, or gating them behind a real feature/debug flag so the component remains clean.
| (a, b) => new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime() | ||
| ); | ||
|
|
||
| useEffect(() => { | ||
| if (scrollRef.current) { | ||
| scrollRef.current.scrollTop = scrollRef.current.scrollHeight; | ||
| } |
There was a problem hiding this comment.
The latestIncomingMessage effect can trigger an immediate second fetchMessages() on mount (or on conversation switch) when latestIncomingMessage.conversationId === activeId, duplicating the initial fetch effect. Consider tracking the last fetched/processed messageId per conversation (or clearing latestIncomingMessage after handling) to avoid redundant network calls.
|
|
||
| const URL = 'http://localhost:4000'; | ||
| // const URL = 'http://localhost:4000'; | ||
| const URL = 'https://app.hyperbuds.com'; |
There was a problem hiding this comment.
Socket server URL is hardcoded to https://app.hyperbuds.com (and localhost is commented out). This makes local/dev/staging configuration brittle and risks pointing the client at the wrong host. Please switch to an environment variable (e.g., NEXT_PUBLIC_SOCKET_URL) with a sensible fallback.
| const URL = 'https://app.hyperbuds.com'; | |
| const URL = process.env.NEXT_PUBLIC_SOCKET_URL ?? 'https://app.hyperbuds.com'; |
Messaging and Chat Improvements:
ChatWindowcomponent now listens for the latest incoming message and automatically fetches new messages for the active conversation, ensuring real-time updates without manual refresh. This is achieved by adding alatestIncomingMessagefield to the Redux store and updating the relevantuseEffecthooks to trigger message fetching when new messages arrive.Authentication Handling:
src/components/layout/Dashboard/Dashboard.tsx)Platform Data Hooks Refactor and Debugging:
usePlatformDataanduseMultiplePlatformDatahooks have been refactored for improved code style, error handling, and debugging. Many API calls and logging lines are now commented out, and placeholder data is returned for development purposes. Error handling for API quota and endpoint availability has been enhanced, with more descriptive logging and error states.UI/UX Adjustments (Temporary):
PlatformUsernameInputcomponent, status message and preview card animations have been commented out, likely for debugging or development purposes.