Bug: Chat Messages Do Not Update in Real-Time (GraphQL Subscriptions Not Utilised)

[JaiPannu-IITI]

Current Problem

At present, our chat system requires a full-page reload to fetch new messages. This negatively impacts user experience by:

• Causing unnecessary delays in message updates.
• Interrupting user interactions with the page.
• Increasing server load due to repeated full-page requests.

Proposed Solution

We are already using GraphQL Subscriptions, which leverage WebSockets under the hood for real-time updates. However, our frontend is currently not fully utilising GraphQL Subscriptions to fetch new messages dynamically. Instead, the page requires a full reload to reflect new messages.

To improve real-time messaging, we should ensure the frontend subscribes to GraphQL Subscriptions for instant message updates. This eliminates the need for polling or manual reloads.

Approach

Frontend: PalisadoesFoundation/talawa-admin#3691

• Ensure GraphQL Subscriptions are properly implemented
• Confirm that the backend publishes new messages correctly via subscriptions.
• Validate that WebSockets (graphql-ws or subscriptions-transport-ws) are handling connections efficiently.
• Modify Frontend to Listen for GraphQL Subscription Events
• Replace the existing polling/reloading mechanism with useSubscription() in Apollo Client.
• Update the chat UI dynamically when new messages arrive via GraphQL Subscriptions.
• Handle Message Persistence & Cache Updates
• Ensure messages are stored in the database and synced across sessions.
• Optimise Apollo Client’s cache to avoid redundant queries and improve performance.
• Error Handling & Reconnection
• Implement automatic reconnection in case of a dropped WebSocket connection.
• Ensure the chat remains functional even if the connection temporarily drops.

Benefits of This Improvement:

• Instant message updates for a better user experience.
• Reduced server load by eliminating unnecessary HTTP requests.
• Smoother, modern chat functionality similar to popular messaging apps.

Next Steps:

• If needed, This feature can later be extended to silent meetings integrating webRTC.

[JaiPannu-IITI]

@palisadoes If you think we should be implementing this, I would like to work on this and PalisadoesFoundation/talawa-admin#3691 in pair for convenient devops.

[varshith257]

Same applies here too use Graphql subscriptions

[JaiPannu-IITI]

@varshith257 Graphql subscriptions provide web sockets under the hood, yes we won't add it separately, I wanted issue to be more descriptive but it became unclear, I have modified it. Thankyou for helping.

[palisadoes]

I'll assign this to you. This will make you exceed your 2 issue limit as an exception

[JaiPannu-IITI]

Thank you so much sir, I’ll ensure that you find the results truly exciting.

[JaiPannu-IITI]

My exams are about to end, will finalize shortly, please don't consider as inactive.

[github-actions]

This issue did not get any activity in the past 10 days and will be closed in 180 days if no update occurs. Please check if the develop branch has fixed it and report again or close the issue.

[JaiPannu-IITI]

Apologies for delay due to exams,Completing by 12EOD.