session sign out

src/Components/SideMenu/index.js

@@ -98,7 +98,7 @@ export default function SideMenu({ setUserSession }) {
                   setUserSession();
                   window.location.href = "/";
 
-                  fetch(Constants.API_ADDRESS + "/user/auth/logout", {
+                  fetch(`${Constants.API_ADDRESS}/user/auth/logout`, {
                     method: "DELETE",
                     headers: {
                       "Content-Type": "application/json",

src/Pages/Login/index.js

@@ -28,7 +28,7 @@ export default function Login({ setUserSession }) {
       return;
     }
 
-    fetch(Constants.API_ADDRESS + "/user/auth/login", {
+    fetch(`${Constants.API_ADDRESS}/user/auth/login`, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({

src/Pages/UserProfile/index.js

@@ -1,6 +1,12 @@
-import { Badge, Space, Table } from "antd";
+import { Badge, Button, Space, Table } from "antd";
 import { useContext } from "react";
-import { FormatDatetime, WebSocketContext } from "../../utils";
+import {
+  Constants,
+  FormatDatetime,
+  UseUserSession,
+  WebSocketContext,
+} from "../../utils";
+import { unstable_HistoryRouter } from "react-router-dom";
 
 const columns = [
   {
@@ -27,11 +33,23 @@ const columns = [
     title: "Action",
     dataIndex: "action",
     key: "action",
-    render: (_, record) => (
+    render: (_, record) => {
-      <Space size="middle">
+      return (
-        <a>Sign out</a>
+        <Space size="middle">
-      </Space>
+          <a
-    ),
+            onClick={() => {
+              fetch(`${Constants.API_ADDRESS}/user/session/${record.key}`, {
+                method: "DELETE",
+              }).catch((err) => {
+                console.error(err);
+              });
+            }}
+          >
+            Sign out
+          </a>
+        </Space>
+      );
+    },
   },
 ];
 
@@ -45,9 +63,9 @@ export default function UserProfile() {
       (a, b) => b.ConnectionStatus - a.ConnectionStatus
     );
 
-    webSocketContext.User.Sessions.forEach((session, index) => {
+    webSocketContext.User.Sessions.forEach((session) => {
       items.push({
-        key: "usersession" + index,
+        key: session.IdForDeletion,
         userAgent: session.UserAgent,
         connectionStatus:
           session.ConnectionStatus === 0 ? (