[ui] Create a Web App to display dealer status updates

[siraj]

DOD :

• It's a simple user interfaces which displays dealers' stats over websockets. should handle all socket states. (reconnects . service going down ..etc)
• react app build from scratch, not from samples from stack overflow
• manage socket context in a shared web worker.
• Yarn should be used prepare the react app and run it locally and inside docker
• docker setup to deliver build artifacts using yarn (bundled html/css/js).
• read me on how to run it ( to evaluate your documentation and language skills)

** please do not submit if any of the above deliveries are missing in your PR, you will not pass the test. ***

Please note:
There's no need for a dedicated design, just dress the data in some boilerplate template of your own choosing (simply put design is not evaluated)

Required API details.

endpoint : wss://dealer-status-reporter-devprem.leverex.io/websocket

sample code which listens to service updates.

import websocket
def on_message(wsapp, message):
    print(message)

websocket.enableTrace(True)
wsapp = websocket.WebSocketApp("wss://dealer-status-reporter-devprem.leverex.io/websocket", on_message=on_message)
wsapp.run_forever()

json signal format

{
   "service_id" : "03984203984",
   "error":false,
   "data":{
      "ready_state":{
         "dealer":false,
         "hedger":false,
         "maker":false,
         "taker":false
      },
      "balances":{
         "maker":{
            "name":"Leverex",
            "_timestamp":1670911088129.3293,
            "balances":{
               "USDT":40.27385,
               "USDP":8.5934
            },
            "ccy":"USDT"
         },
         "taker":{
            "name":"Bitfinex",
            "_timestamp":1670911088129.3547,
            "ccy":"TESTUSDTF0",
            "balances":{
               "margin":{
                  "TESTUSDTF0":{
                     "total":30010.61809796453,
                     "free":30004.89743129453,
                     "reserved":5.720666670000355
                  },
                  "AAA":{
                     "total":9000,
                     "free":9000,
                     "reserved":0
                  },
                  "BBB":{
                     "total":10000,
                     "free":10000,
                     "reserved":0
                  },
                  "TESTBTC":{
                     "total":4,
                     "free":4,
                     "reserved":0
                  }
               },
               "exchange":{
                  "AAA":{
                     "total":1000,
                     "free":1000,
                     "reserved":0
                  },
                  "TESTUSD":{
                     "total":8898.8,
                     "free":8898.8,
                     "reserved":0.0
                  },
                  "TESTBTC":{
                     "total":0.0998,
                     "free":0.0998,
                     "reserved":0.0
                  }
               }
            }
         }
      },
      "positions":{
         "maker":{
            "name":"Leverex",
            "netExposure":0.005,
            "_timestamp":1670911155217.4775,
            "indexPrice":17194.67,
            "orderData":{
               "id":1670910604108,
               "orders":{
                  "110270":{
                     "_id":"110270",
                     "_timestamp":1670910604,
                     "_quantity":0.005,
                     "_price":17186.8,
                     "_side":1,
                     "_status":1,
                     "_product_type":"xbtusd_rf",
                     "_trade_pnl":0.03934999999999491,
                     "_reference_exposure":"0.005",
                     "_session_id":1670910604108,
                     "_rollover_type":1,
                     "_fee":-0.075,
                     "_is_taker":true,
                     "indexPrice":17194.67,
                     "sessionIM":1718.6799999999998
                  }
               },
               "netExposure":0.005,
               "session":{
                  "open":{
                     "product_type":"xbtusd_rf",
                     "cut_off_at":"2022-12-13 11:30:00",
                     "last_cut_off_price":17186.8,
                     "session_id":1670910604108,
                     "previous_session_id":"1670910003760"
                  },
                  "close":null
               }
            }
         },
         "taker":{
            "name":"Bitfinex",
            "netExposure":-0.005,
            "_timestamp":1670911155217.5242,
            "product":"tTESTBTCF0:TESTUSDTF0",
            "positions":{
               "tTESTBTCF0:TESTUSDTF0":{
                  "157895580":{
                     "position":{
                        "symbol":"tTESTBTCF0:TESTUSDTF0",
                        "status":"ACTIVE",
                        "amount":-0.005,
                        "base_price":17162,
                        "margin_funding":0.0025,
                        "margin_funding_type":0,
                        "profit_loss":-0.125,
                        "profit_loss_percentage":-0.1454672407773769,
                        "liquidation_price":18220.323334,
                        "leverage":14.999999991259761,
                        "id":157895580,
                        "mts_create":null,
                        "mts_update":null,
                        "type":1,
                        "collateral":5.72066667,
                        "collateral_min":0.8581000000000001,
                        "meta":{
                           "reason":"TRADE",
                           "order_id":109945958611,
                           "order_id_oppo":109983692738,
                           "liq_stage":null,
                           "trade_price":"17165.0",
                           "trade_amount":"0.005",
                           "order_cid":1670909729733,
                           "order_gid":null
                        }
                     }
                  }
               }
            }
         }
      }
   },
   "reason":null
}

[davrv93]

That user Fei X.
@Ling19329
have posted the work on freelancer, and he didnt pay ! so be careful with him.