feat: ws event real read count

Signed-off-by: Innei <[email protected]>

Author: Innei

src/components/modules/note/NoteMetaBar.tsx

@@ -60,7 +60,10 @@ export const NoteMetaReadCount = () => {
       {dividerVertical}
       <span className={sectionBlockClassName} key="readcount">
         <i className="icon-[mingcute--book-6-line]" />
-        <span className="font-medium">{read}</span>
+
+        <span className="font-medium">
+          <NumberSmoothTransition>{read}</NumberSmoothTransition>
+        </span>
       </span>
     </>
   )

src/components/modules/post/PostMetaBar.tsx

@@ -106,7 +106,9 @@ export const PostMetaBar: Component<{
       {!!meta.count?.read && (
         <div className="flex min-w-0 items-center space-x-1">
           <i className="icon-[mingcute--eye-2-line]" />
-          <span className="min-w-0 truncate">{meta.count.read}</span>
+          <span className="min-w-0 truncate">
+            <NumberSmoothTransition>{meta.count.read}</NumberSmoothTransition>
+          </span>
         </div>
       )}
       {!!meta.count?.like && (

src/socket/handler.ts

@@ -262,6 +262,34 @@ export const eventHandler = (
       deleteActivityPresence(payload.identity)
       break
     }
+    case EventTypes.ARTICLE_READ_COUNT_UPDATE: {
+      const { id, count, type } = data
+      if (!count) {
+        break
+      }
+
+      switch (type) {
+        case 'post': {
+          const currentData = getGlobalCurrentPostData()
+          if (currentData?.id === id) {
+            setGlobalCurrentPostData((draft) => {
+              draft.count.read = count
+            })
+          }
+          break
+        }
+        case 'note': {
+          const currentData = getCurrentNoteData()?.data
+          if (currentData?.id === id) {
+            setCurrentNoteData((draft) => {
+              draft.data.count.read = count
+            })
+          }
+          break
+        }
+      }
+      break
+    }
 
     case 'fn#media-update': {
       setActivityMediaInfo(data)

src/types/events.ts

@@ -32,6 +32,7 @@ export const enum EventTypes {
 
   ACTIVITY_UPDATE_PRESENCE = 'ACTIVITY_UPDATE_PRESENCE',
   ACTIVITY_LEAVE_PRESENCE = 'ACTIVITY_LEAVE_PRESENCE',
+  ARTICLE_READ_COUNT_UPDATE = 'ARTICLE_READ_COUNT_UPDATE',
 }
 
 export interface EventTypesPayload {