feat: Realtime Increment View Count Without Refreshing Pages#10760
feat: Realtime Increment View Count Without Refreshing Pages#10760mergify[bot] merged 3 commits intomasterfrom
Conversation
| socketIoService | ||
| .getDefaultSocket() | ||
| .in(getRoomNameWithId(RoomPrefix.PAGE, page._id)) | ||
| .emit('page:seenUsersUpdated', { s2cMessagePageSeenUsersUpdated }); |
There was a problem hiding this comment.
/src/interfaces/websocket.ts に追加した PageSeenUsersUpdated を使うようにしましょう
There was a problem hiding this comment.
以下のように修正いたしました。
S2cMessagePageSeenUsersUpdatedクラスを削除し、Socket.IO メッセージを{ pageId }のみに簡素化- 既存の
SyncPageStatusServiceのリスナー構造はそのまま活用
| this.pageId = serializedPage._id; | ||
| this.seenUserIds = serializedPage.seenUsers | ||
| .slice(0, 15) | ||
| .map((id: any) => (typeof id === 'string' ? id : id.toString())); |
There was a problem hiding this comment.
ts の恩恵がなくなるので any はなるべく使わないようにしてください
There was a problem hiding this comment.
こちらのFB通り、クライアント側の既存データを書き換えをやめたので、クラスS2cMessagePageSeenUsersUpdated自体を削除しました
| (currentData) => { | ||
| if (currentData == null) return currentData; | ||
| return { | ||
| ...currentData, | ||
| seenUserIds: s2cMessagePageSeenUsersUpdated.seenUserIds, | ||
| sumOfSeenUsers: s2cMessagePageSeenUsersUpdated.seenUsersCount, | ||
| }; | ||
| }, | ||
| { revalidate: false }, |
There was a problem hiding this comment.
- これって mutatePageInfo をただ呼ぶだけじゃだめかな？
- socket.io を通じて受け取ったデータでクライアント側の既存データを書き換えると実装が複雑になるので、単純に
page:seenUsersUpdatedイベントが発火したらサーバーからデータを再 fetch するみたいな感じの方がシンプルだと思う - ↑ を採用する場合はサーバー側は pageId だけを送るだけで良いので
S2cMessagePageSeenUsersUpdatedは不要 (冗長) だと思う
There was a problem hiding this comment.
FBいただいた内容の通り、以下のように修正しました。
seenUserIds,sumOfSeenUsersを廃止し、mutatePageInfo()を引数なしで呼び、既存の /page/info APIから再fetchする方式に変更
| socketIoService | ||
| .getDefaultSocket() | ||
| .in(getRoomNameWithId(RoomPrefix.PAGE, page._id)) | ||
| .emit('page:seenUsersUpdated', { pageId }); |
There was a problem hiding this comment.
page:seenUsersUpdated がハードコードのままになっているので SocketEventName.PageSeenUsersUpdated を使うように修正してください
|
@mergify queue |
✅ The pull request has been merged automaticallyDetailsThe pull request has been merged automatically at 89538c8 |
Merge Queue Status✅ The pull request has been merged at 4435928 This pull request spent 13 minutes 4 seconds in the queue, including 12 minutes 40 seconds running CI. Required conditions to merge
|
3 participants
Task
https://redmine.weseek.co.jp/issues/178067
変更点
サーバーサイド: EventEmitter → Socket io の橋渡し
websocket.ts: PageSeenUsersUpdated イベント名定数を追加s2c-message.ts: S2cMessagePageSeenUsersUpdated クラスを追加（pageId, seenUserIds, seenUsersCount を送信）sync-page-status.ts: addSeenUsers リスナーを追加し、既存の create/update/delete と同じパターンでpage:seenUsersUpdated を同一ページの room に送信クライアントサイド: Socket io 受信 → UI更新
page-seen-users-updated.ts（新規ファイル）: Socket io イベントを受信し、SWRキャッシュの sumOfSeenUsers と seenUserIds を直接更新するフックEditablePageEffects.tsx: 上記フックを登録