scan result

src/Pages/Scanners/index.js

@@ -1,4 +1,4 @@
-import { Space, Table, message } from "antd";
+import { Popconfirm, Space, Table, message } from "antd";
 import {
   FormatDatetime,
   MyAvatar,
@@ -42,9 +42,12 @@ const columns = [
     key: "action",
     render: (_, record) => (
       <Space size="middle">
-        <Link
+        <Popconfirm
-          to="#"
+          placement="left"
-          onClick={() => {
+          title="Are you sure you want to use this scanner?"
+          description="Users connected to this scanner will be disconnected"
+          okText="Yes"
+          onConfirm={() => {
             if (getUserId() === record._usedByUserId) {
               message.error("You are already using this scanner");
               return;
@@ -59,8 +62,8 @@ const columns = [
             }).catch((err) => console.error(err));
           }}
         >
-          Use scanner
+          <Link to="#">Use scanner</Link>
-        </Link>
+        </Popconfirm>
       </Space>
     ),
   },
@@ -92,7 +95,7 @@ export default function Scanners() {
             </>
           ),
         _usedByUserId: scanner.UsedByUserId,
-        lastUsed: scanner.LastUsed,
+        lastUsed: FormatDatetime(scanner.LastUsed),
         registeredAt: FormatDatetime(scanner.RegisteredAt),
         userAgent: scanner.UserAgent,
       });

src/utils.js

@@ -2,6 +2,7 @@ import { UserOutlined } from "@ant-design/icons";
 import { Avatar, Badge, Tooltip } from "antd";
 import { createContext, useEffect, useRef, useState } from "react";
 import { useNavigate } from "react-router-dom";
+import { Buffer } from "buffer";
 
 /**
  * constants
@@ -105,6 +106,8 @@ const ReceivedMessagesCommands = {
   NewScanner: 11,
   DeleteScanner: 12,
   UpdateScannerUsedByUserId: 13,
+  ScanResult: 14,
+  UpdateScannerLastUsed: 15,
 };
 
 // commands sent to the backend server
@@ -265,6 +268,46 @@ export function WebSocketProvider({
             return newArr;
           });
           break;
+        case ReceivedMessagesCommands.ScanResult:
+          const decodedScanResult = Buffer.from(body, "base64").toString();
+
+          if (decodedScanResult === "" || decodedScanResult === null) {
+            notificationApi["error"]({
+              message: `Failed to decode scan result`,
+              description: "See in developer console",
+            });
+
+            console.error(
+              "Received scan result: ",
+              body,
+              "Decoded result: ",
+              decodedScanResult
+            );
+            break;
+          }
+
+          notificationApi["info"]({
+            message: `Scan Result`,
+            description: Buffer.from(body, "base64").toString(),
+          });
+
+          new Audio(
+            `${Constants.STATIC_CONTENT_ADDRESS}sounds/scan_result.mp3`
+          ).play();
+
+          break;
+        case ReceivedMessagesCommands.UpdateScannerLastUsed:
+          console.log("Received", body);
+          setScanners((arr) => {
+            const newArr = [...arr];
+
+            newArr[
+              arr.findIndex((arr1) => arr1.Id === body.ScannerId)
+            ].LastUsed = body.LastUsed;
+
+            return newArr;
+          });
+          break;
         default:
           console.error("unknown command", cmd);
           break;