Fix client base64

client/package.json

@@ -33,6 +33,7 @@
         "immer": "^10.1.1",
         "intl-messageformat": "^10.7.4",
         "javascript-color-gradient": "^2.5.0",
+        "js-base64": "^3.7.7",
         "lodash.merge": "^4.6.2",
         "next": "15.0.2",
         "next-themes": "^0.3.0",

client/src/components/navbar/InfoButton.jsx

@@ -32,7 +32,10 @@ export default function InfoButton ({ tooltipPlacement = 'bottom' }) {
                 ['react'],
                 ['zustand'],
                 ['immer'],
-                ['framer-motion']
+                ['framer-motion'],
+                ['javascript-color-gradient'],
+                ['styled-components'],
+                ['js-base64']
               ].map((item) => (
                 <li key={item[0]}>
                   <Link

client/src/config/utils/ws/sendMessage.js

@@ -1,4 +1,5 @@
 import { v4 as uuidv4 } from 'uuid';
+import { Base64 } from 'js-base64';
 
 import { useGlobalStore } from '@/hooks/store/globalStore';
 import { wsStatus } from '@/config/consts/enums';
@@ -17,17 +18,40 @@ export default async function sendMessage (commandType, data) {
 
     const messageUuid = uuidv4();
 
-    if (tryResolveConfirm !== null) myReject('Different message is already being sent');
-    if (get_sendMessage() === null) myReject('_sendMessage is null');
-    if (getWsStatus() !== wsStatus.open) myReject('Websocket is not open');
+    // Checking
+    if (tryResolveConfirm !== null) {
+      myReject('Different message is already being sent');
+
+      return;
+    }
+    if (get_sendMessage() === null) {
+      myReject('_sendMessage is null');
+
+      return;
+    }
+    if (getWsStatus() !== wsStatus.open) {
+      myReject('Websocket is not open');
+
+      return;
+    }
+
+    let message;
+
+    try {
+      message = `${commandType}|${messageUuid}|${Base64.encode(data)}`;
+    } catch (e) {
+      myReject('Failed to encode message: ' + e);
+
+      return;
+    }
 
     setTryResolveConfirm(tryResolve);
 
     const timeoutTimer = setTimeout(() => {
       myResolve(false, 'Timeout');
     }, 5000);
 
-    get_sendMessage()(`${commandType}|${messageUuid}|${btoa(data)}`);
+    get_sendMessage()(message);
 
     // Beginning of functions
 

client/src/config/utils/ws/wsHandler.js

@@ -1,4 +1,5 @@
 import { camelizeKeys } from 'humps';
+import { Base64 } from 'js-base64';
 
 import { useGlobalStore } from '@/hooks/store/globalStore';
 
@@ -24,7 +25,7 @@ export const handleMessage = (message) => {
 
     if (messageParts.length !== 3) return;
     [commandType, messageUuid, messageData] = messageParts;
-    messageData = atob(messageData);
+    messageData = Base64.decode(messageData);
     messageData = JSON.parse(messageData);
     messageData = camelizeKeys(messageData);
   } catch { return; }

client/yarn.lock

@@ -3867,6 +3867,7 @@ __metadata:
     immer: "npm:^10.1.1"
     intl-messageformat: "npm:^10.7.4"
     javascript-color-gradient: "npm:^2.5.0"
+    js-base64: "npm:^3.7.7"
     lodash.merge: "npm:^4.6.2"
     next: "npm:15.0.2"
     next-themes: "npm:^0.3.0"
@@ -4538,6 +4539,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"js-base64@npm:^3.7.7":
+  version: 3.7.7
+  resolution: "js-base64@npm:3.7.7"
+  checksum: 10c0/3c905a7e78b601e4751b5e710edd0d6d045ce2d23eb84c9df03515371e1b291edc72808dc91e081cb9855aef6758292a2407006f4608ec3705373dd8baf2f80f
+  languageName: node
+  linkType: hard
+
 "js-tokens@npm:^3.0.0 || ^4.0.0":
   version: 4.0.0
   resolution: "js-tokens@npm:4.0.0"