God, I think the Developer did it.

luckydiamond/src/assets/css/ComponentsStyles/chat.css

@@ -183,4 +183,12 @@
 
 .write__content button:disabled {
     cursor: not-allowed;
+}
+
+.system-message {
+    background-color: rgb(1, 56, 74);
+}
+
+.mention-message {
+    background-color: rgb(169, 113, 0);
 }

luckydiamond/src/assets/css/ComponentsStyles/developer.css

@@ -0,0 +1,153 @@
+.developer-card__content_down {
+    width: 1204px;
+    height: 443px;
+    background-color: aquamarine;
+    margin-left: 287px;
+    margin-right: 298px;
+    margin-bottom: 77px;
+}
+.developer-card__content {
+   
+    display: flex;
+    
+    background-color: black;
+
+}
+
+/* beginning card 1 */
+
+.developer-card__width {
+    display: flex;
+    width: 422px;
+    height: 269px;
+    border-radius: 22px;
+    border: 3px solid #595959 ;
+    /*background-color: #742271;*/
+}
+
+.developer-card__about-text {
+    margin: 30px 0 0 15px;
+}
+
+.developer-card__about-text p {
+    font-family: 'Montserrat';
+    color: #fff;
+    font-size: 14px;
+}
+
+.developer-card__about-text h1 {
+    font-family: 'Montserrat';
+    color: #fff;
+    font-size: 32px;
+    margin-bottom: 20px;
+}
+
+.developer-card__technology {
+    display: flex;
+    margin: 5px 0 0 15px;
+    font-family: 'Montserrat';
+}
+
+.developer-card__technology img {
+    width: 21px;
+    height: 21px;
+    margin-right: 3px;
+}
+
+.developer-card__socials {
+    justify-content: space-around;
+    display: flex;
+    margin: 35% 0 11px 27px;
+    
+}
+
+.developer-card__socials img {
+    width: 36px;
+    height: 36px;
+    border-radius: 10px;
+}
+
+.developer-card__skin {
+    display: flex;
+    align-items: flex-end;
+    margin-left: 15px;
+}
+
+.developer-card__skin img {
+    width: 212px;
+    height: 212px;
+}
+
+/*the and card 1*/
+
+/*beginning card 2*/
+
+.developer-card__height {
+    width: 250px;
+    height: 443px;
+    background-color: #413C3B;
+    border: 3px solid #595959 ;
+    border-radius: 22px;
+}
+
+.developer-card-height__about-text {
+    margin: 30px 0 0 19px;
+    
+}
+.developer-card-height__about-text p {
+    font-family: 'Montserrat';
+    color: #fff;
+    font-size: 14px;
+}
+
+.developer-card-height__about-text h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+}
+
+.developer-card-height__technology {
+    display: flex;
+    font-family: 'Montserrat';
+    margin: 30px 0 0 24px;
+}
+
+.developer-card-height__technology-two-column {
+    display: flex;
+    font-family: 'Montserrat';
+    margin: 10px 0 0 22px;
+}
+
+.techonology-styles img {
+    height: 20px;
+    margin-right: 5px;
+}
+
+.developer-card-height__skin {
+    margin-top: 6px;
+    display: inline-block;
+    align-items: center;
+    justify-content: center;
+}
+
+.developer-card-height__skin {
+    width: 212px;
+    height: 212px;
+   
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+    margin-top: 54px;
+}
+
+.developer-card-height__social-icons {
+   justify-content: space-around;
+    display: flex;
+}
+
+
+
+
+
+
+

luckydiamond/src/assets/js/chat/ChatLogic.js

@@ -1,62 +1,66 @@
-import { BackendWebSocketUrl } from '@/properties/Сonfig.js';
-import { eventBus } from "@/main";
-import {
-    GetCookie
-} from "@/assets/js/storage/CookieStorage.js";
-
-let webSocket;
-
-export function ConnectToChat() {
-    try {
-        webSocket = new WebSocket(BackendWebSocketUrl);
-
-        webSocket.onopen = function () {
-            console.log('Connection established');
-        };
-
-        webSocket.onmessage = function (event) {
-
-            eventBus.emit('dataChat', event.data)
-
-            console.log('Message from Server:', event.data);
-        };
-
-        webSocket.onclose = function () {
-
-            webSocket = new WebSocket(BackendWebSocketUrl);
-
-            console.log('Connection closed and reconnected');
-        };
-
-        webSocket.onerror = function (event) {
-            console.error('WebSocket Error:', event);
-        };
-    } catch (error) {
-        console.error('Error in ConnectToChat:', error);
-    }
-}
-
-export function SendMessageToChat(message) {
-    try {
-
-        if (!GetCookie("SpUserName") && !GetCookie("AUTHTOKEN") && !GetCookie("SearchToken")) {
-            return;
-        }
-
-        const userCredentials = {
-            SearchToken: GetCookie("SearchToken"),
-            AUTHTOKEN: GetCookie("AUTHTOKEN")
-        };
-
-        const messageObject = {
-            UserCredentials: userCredentials,
-            Message: message,
-            MessageType: "Chat"
-        };
-
-        webSocket.send(JSON.stringify(messageObject));
-
-    } catch (error) {
-        console.error('Error in ConnectToChat:', error);
-    }
-}
+// import { BackendWebSocketUrl } from '@/properties/Сonfig.js';
+// import { eventBus } from "@/main";
+// import {
+//     GetCookie
+// } from "@/assets/js/storage/CookieStorage.js";
+//
+// let webSocket;
+//
+// export function ConnectToChat() {
+//     try {
+//         webSocket = new WebSocket(BackendWebSocketUrl);
+//
+//         webSocket.onopen = function () {
+//             console.log('Connection established');
+//         };
+//
+//         webSocket.onmessage = function (event) {
+//
+//             const dataObject = JSON.parse(event.data);
+//
+//             if (dataObject && Object.prototype.hasOwnProperty.call(dataObject, 'SpUserName') && Object.prototype.hasOwnProperty.call(dataObject, 'Message')) {
+//                 eventBus.emit('dataChat', event.data);
+//             }
+//
+//             console.log('Message from Server:', event.data);
+//         };
+//
+//         webSocket.onclose = function () {
+//
+//             webSocket = new WebSocket(BackendWebSocketUrl);
+//
+//             console.log('Connection closed and reconnected');
+//         };
+//
+//         webSocket.onerror = function (event) {
+//             console.error('WebSocket Error:', event);
+//         };
+//     } catch (error) {
+//         console.error('Error in ConnectToChat:', error);
+//     }
+// }
+//
+// export function SendMessageToChat(message) {
+//     try {
+//
+//         if (!GetCookie("SpUserName") && !GetCookie("AUTHTOKEN") && !GetCookie("SearchToken")) {
+//             return;
+//         }
+//
+//         const userCredentials = {
+//             SearchToken: GetCookie("SearchToken"),
+//             AUTHTOKEN: GetCookie("AUTHTOKEN")
+//         };
+//
+//         const messageObject = {
+//             UserCredentials: userCredentials,
+//             Message: message,
+//             MessageType: "Chat"
+//         };
+//
+//         webSocket.send(JSON.stringify(messageObject));
+//
+//     } catch (error) {
+//         console.error('Error in ConnectToChat:', error);
+//     }
+// }

luckydiamond/src/assets/js/rest/RestMethods.js

@@ -55,7 +55,7 @@ export async function GetCurrentMoney(authToken, searchToken) {
 export async function GetChatHistory() {
 
   try {
-    const response = await fetch(`${BackendApiUrl}/ChatHistory/GetChatHistory`, {
+    const response = await fetch(`${BackendApiUrl}/Chat/GetChatHistory`, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",