github.com/christoph-karpowicz/db_mediator@v0.0.0-20210207102849-61a28a1071d8/web/src/componenets/content/sections/synchs/TopPane.tsx (about) 1 import React from 'react'; 2 import { useParams } from "react-router-dom"; 3 import WS from '../../../../ws/ws'; 4 import WSRequest from '../../../../ws/request'; 5 6 function TopPane() { 7 const { name } = useParams(); 8 9 const onStartSynch = () => { 10 const req = new WSRequest("startSynch", { payload: name }); 11 WS.getSocket().then((ws) => { 12 ws.emitAndAwaitResponse(req) 13 .then((res: any) => { 14 try { 15 const result = JSON.parse(res.Data.Payload); 16 } catch(e) { 17 console.error(e); 18 } 19 console.log(res); 20 }) 21 .catch((err: any) => { 22 console.error(err); 23 }); 24 }); 25 }; 26 27 const onStopSynch = () => { 28 const req = new WSRequest("stopSynch", { payload: name }); 29 WS.getSocket().then((ws) => { 30 ws.emitAndAwaitResponse(req) 31 .then((res: any) => { 32 try { 33 const result = JSON.parse(res.Data.Payload); 34 } catch(e) { 35 console.error(e); 36 } 37 console.log(res); 38 }) 39 .catch((err: any) => { 40 console.error(err); 41 }); 42 }); 43 }; 44 45 return ( 46 <div className="synchs-top-pane"> 47 <button className="synchs-top-pane-button" onClick={onStartSynch}> 48 Start 49 </button> 50 <button className="synchs-top-pane-button" onClick={onStopSynch}> 51 Stop 52 </button> 53 </div> 54 ); 55 } 56 57 export default TopPane;