Replace Socket.IO real-time sync with GraphQL subscriptions

[0xdevcollins]

Depends on: #100, Backend subscription implementation

The frontend uses Socket.IO (lib/socket/client.ts, hooks/use-socket-sync.ts, lib/query/sync/socket-sync.ts) for real-time bounty updates. The plan is to replace this with GraphQL subscriptions.

Note: This is blocked on the backend implementing bountyCreated, bountyUpdated, bountyDeleted subscriptions.

Tasks

• Install graphql-ws client package
• Create lib/graphql/subscriptions.ts with subscription documents
• Create a useGraphQLSubscription wrapper hook that subscribes and invalidates React Query cache
• Replace useSocketSync with the new subscription-based sync
• Remove lib/socket/client.ts, lib/query/sync/socket-sync.ts, lib/query/sync/handlers.ts
• Remove socket.io-client dependency from package.json

Acceptance Criteria

• Real-time updates work via GraphQL subscriptions
• All Socket.IO code is removed
• socket.io-client is no longer a dependency

[linear]

BOU-98

[coderabbitai]

🔗 Related PRs

#30 - feat: Implement React Query hooks for managing bounties [merged]
#41 - feat: add websocket client module [merged]
#45 - Ekene001/bou 59 setup graphql client code generation [merged]
#88 - feat: Implement bounties detail page [merged]

---

📝 Issue Planner

_{Check the box below or use the @coderabbitai plan command to generate an implementation plan and prompts that you can use with your favorite coding assistant.}

• Create Plan

---

🧪 Issue enrichment is currently in open beta.

You can configure auto-planning by selecting labels in the issue_enrichment configuration.

To disable automatic issue enrichment, add the following to your .coderabbit.yaml:

issue_enrichment:
  auto_enrich:
    enabled: false

💬 Have feedback or questions? Drop into our discord!

[drips-wave]

This issue has been added to the Stellar Wave Program and is worth 150 Points.

🧑‍💻 Interested in contributing? Apply to work on this issue on Drips Wave, earn points, and receive rewards.

Warning

Only applications submitted via the apply link above will be considered. Please do not apply by commenting on the issue or opening a PR directly.

🤠 Repo maintainers: You can manage this issue's Points and Complexity on your Maintainer Dashboard here. Please keep an eye on applications and respond quickly 💙

ℹ️ Learn more about Drips Wave

[morelucks]

@morelucks has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Hello,

I’m a smart contract and full-stack developer interested in contributing to this issue. I’m an experienced contributor on OnlyDust and participated in Drips Wave 1, with hands-on experience in Rust, Soroban, Cairo, Solidity, and TypeScript.

I’m passionate about building secure and scalable blockchain solutions, with a strong focus on writing clean, maintainable code. Based on the scope of this issue, I’m confident I can deliver a complete solution within 24 hours of assignment.

I would appreciate the opportunity to contribute and help move this forward.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @morelucks to this issue.

[Ekene001]

@Ekene001 has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Hi, I've gone through the requirements and can have this ready in under 24 hours. I have experience migrating legacy WebSocket implementations to modern GraphQL subscription layers, so I’m familiar with the graphql-ws setup and the cache invalidation patterns required to keep React Query in sync.

I’ll tackle this by installing the graphql-ws client and setting up the subscription documents for bounty creation, updates, and deletions. I'll build a custom useGraphQLSubscription wrapper to handle the connection lifecycle and trigger the necessary cache invalidations on the frontend. Finally, I’ll strip out the old Socket.IO client logic and dependencies, ensuring that real-time updates are lean, type-safe, and fully integrated into your GraphQL ecosystem.

Please assign this to me.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Ekene001 to this issue.

[johnsmccain]

@johnsmccain has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

I would love to handle this

ℹ️ Repo Maintainers: To accept this application, review their application or assign @johnsmccain to this issue.

[0xDeon]

@DanielEmmanuel1 has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Hi team,

I'd like to be assigned this issue. I'm a frontend engineer with solid experience replacing Socket.IO with GraphQL subscriptions using graphql-ws and I can handle the full migration — setting up the subscription documents, building the useGraphQLSubscription wrapper hook, wiring cache invalidation, and cleanly removing all Socket.IO code and dependencies.
Please assign it to me!

ℹ️ Repo Maintainers: To accept this application, review their application or assign @DanielEmmanuel1 to this issue.