websrc/components/Tables.tsx

@@ -1,6 +1,6 @@
 import React, {Component} from "react"
 import {Badge, Button, Container, Table} from "react-bootstrap"
-import {NewTickData, PositionState, socket} from '../';
+import {NewTickData, PositionCloseMessage, PositionState, socket} from '../';
 
 
 export class PositionTable extends Component<{}, { positions: Array<PositionState> }> {
@@ -54,7 +54,12 @@ export class PositionTable extends Component<{}, { positions: Array<PositionStat
                 <td className={"align-middle"}>{position.profit_loss.toFixed(2)}</td>
                 <td className={"align-middle"}>{position.profit_loss_percentage.toFixed(2)} %</td>
                 <td className={"align-middle"}><Button size={"sm"} variant={"danger"} onClick={() => {
-                    socket.emit("close", ({"id": position.id}))
+                    const message : PositionCloseMessage = {
+                        message_name: "close_position",
+                        position_id: position.id,
+                        symbol: position.symbol
+                    }
+                    socket.emit(message.message_name, (message))
                 }}>Close</Button></td>
             </tr>)
         })

websrc/index.tsx

@@ -22,6 +22,12 @@ export type PositionState = {
     profit_loss_percentage: number
 }
 
+export type PositionCloseMessage = {
+    message_name: string,
+    position_id: number,
+    symbol: string
+}
+
 socket.on("connect", function () {
     console.log("Connected!")
 })