socketio-client for user-dashboard

huytran17 · May 25, 2024 · 8b0defa · 8b0defa
1 parent 8e42bac
commit 8b0defa
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 13 deletions.
diff --git a/core/server/src/config/socket.io/nsp/client.ts b/core/server/src/config/socket.io/nsp/client.ts
@@ -1,7 +1,6 @@
 import { Namespace, Server } from "socket.io";
 import {
   ClientEvents,
-  ServerEvents,
   SocketEvents,
   SocketIONsp,
 } from "../../../constants/socket.io";
@@ -16,9 +15,7 @@ interface ClientToServerEvents {
   [ClientEvents.ONLINE]: ({ user_id }: IUserPayload) => void;
 }
 
-interface ServerToClientEvents {
-  [ServerEvents.OFFLINE]: ({ user_id }: IUserPayload) => void;
-}
+interface ServerToClientEvents {}
 
 export default function makeInitialClientNsp({ userDb }: { userDb: IUserDb }) {
   return function initialClientNsp({ io }: { io: Server }) {
@@ -27,7 +24,7 @@ export default function makeInitialClientNsp({ userDb }: { userDb: IUserDb }) {
     const online_users = {};
 
     const client_nsp: Namespace<ClientToServerEvents, ServerToClientEvents> =
-      io.of(SocketIONsp.CLIENT_PRIVATE);
+      io.of(SocketIONsp.PRIVATE_CLIENT);
 
     client_nsp.on(SocketEvents.CONNECT, (socket) => {
       socket.on(

diff --git a/core/server/src/constants/socket.io.ts b/core/server/src/constants/socket.io.ts
@@ -1,6 +1,6 @@
 const SocketIONsp = {
-  ADMIN_PRIVATE: "/admin-private",
-  CLIENT_PRIVATE: "/client-private",
+  PRIVATE_ADMIN: "/private-admin",
+  PRIVATE_CLIENT: "/private-client",
 };
 
 const SocketEvents = {
@@ -12,15 +12,10 @@ enum ClientEvents {
   ONLINE = "online",
 }
 
-enum ServerEvents {
-  OFFLINE = "offline",
-}
-
 export default Object.freeze({
   SocketIONsp,
   SocketEvents,
   ClientEvents,
-  ServerEvents,
 });
 
-export { SocketIONsp, SocketEvents, ClientEvents, ServerEvents };
+export { SocketIONsp, SocketEvents, ClientEvents };
diff --git a/core/user-dashboard/config/socket.io/private-client/index.ts b/core/user-dashboard/config/socket.io/private-client/index.ts
@@ -0,0 +1,31 @@
+import { io, Socket } from "socket.io-client";
+import { SOCKETIO_EMIT_EVENT, SOCKETIO_NSP } from "~/constants";
+
+interface ServerToClientEvents {}
+
+interface ClientToServerEvents {
+  online: ({ user_id }: { user_id: string }) => void;
+}
+
+export default function initialPrivateSocketIO({
+  user_id,
+}: {
+  user_id: string;
+}) {
+  try {
+    if (!user_id) {
+      return;
+    }
+
+    const socket: Socket<ServerToClientEvents, ClientToServerEvents> = io(
+      `${process.env.SERVER_URL}/${SOCKETIO_NSP.PRIVATE_CLIENT}`,
+      {
+        withCredentials: true,
+      }
+    );
+
+    socket.emit(SOCKETIO_EMIT_EVENT.ONLINE, { user_id });
+  } catch (error) {
+    console.error(error);
+  }
+}
diff --git a/core/user-dashboard/constants/index.ts b/core/user-dashboard/constants/index.ts
@@ -38,12 +38,22 @@ const SEO_TYPE = {
   CATEGORY: "category",
 };
 
+const SOCKETIO_NSP = {
+  PRIVATE_CLIENT: "private-client",
+};
+
+enum SOCKETIO_EMIT_EVENT {
+  ONLINE = "online",
+}
+
 export default Object.freeze({
   SOCIAL_MEDIA_TYPES,
   SOCIALITE_URL,
   HTTP_STATUS_CODE,
   COMMENT_LIKE_TYPE,
   SEO_TYPE,
+  SOCKETIO_NSP,
+  SOCKETIO_EMIT_EVENT,
 });
 
 export {
@@ -52,4 +62,6 @@ export {
   HTTP_STATUS_CODE,
   COMMENT_LIKE_TYPE,
   SEO_TYPE,
+  SOCKETIO_NSP,
+  SOCKETIO_EMIT_EVENT,
 };
diff --git a/core/user-dashboard/pages/index.vue b/core/user-dashboard/pages/index.vue
@@ -6,6 +6,8 @@
 import { get } from "lodash";
 import { mapGetters, mapActions } from "vuex";
 import BaseArticles from "@/components/article/BaseArticles";
+import initialPrivateSocketIO from "@/config/socket.io/private-client";
+
 export default {
   name: "IndexPage",
   async asyncData({ store, route }) {
@@ -48,5 +50,9 @@ export default {
       GET_POSTS_PAGINATED: "post/GET_POSTS_PAGINATED",
     }),
   },
+
+  fetch() {
+    initialPrivateSocketIO({user_id: this.me._id});
+  },
 };
 </script>