Merge pull request #14 from make-software/fix-bugs-on-jackpots-page

Fixed bugs on Jackpots page

client/src/app/scenes/jackpots/JackpotTableRow.tsx

@@ -14,7 +14,7 @@ const JackpotTableRow = ({ round }: { round: Round }) => {
 		winnerPublicKey,
 		jackpotAmount,
 		endedAt,
-		deployHash,
+		lastPlayDeployHash,
 	} = round;
 
 	const roundPath = `/jackpot/${roundId}`;
@@ -33,7 +33,7 @@ const JackpotTableRow = ({ round }: { round: Round }) => {
 			<TableData />
 			<TableData>
 				<DeployTimestamp
-					deployHash={deployHash}
+					deployHash={lastPlayDeployHash}
 					timestamp={endedAt}
 				/>
 			</TableData>

client/src/app/scenes/round/index.tsx

@@ -53,7 +53,6 @@ const JackpotRoundTable = ({ id }: { id: string }) => {
 					handleReset={resetLimit}
 				/>
 			)}
-			itemsLabel={'round'}
 		/>
 	);
 };

client/src/app/services/hooks/use-manage-play.ts

@@ -73,7 +73,7 @@ const useManagePlay = (): ManagePlayData => {
 	}, [executedDeploy]);
 
 	const onReceiveWsMessage = (message: { data: string }) => {
-		if (isDeploy(message.data)) {
+		if (message.data) {
 			const deploy = JSON.parse(message.data) as DeployMessage;
 			setExecutedDeploy(deploy.data);
 		}
@@ -82,6 +82,8 @@ const useManagePlay = (): ManagePlayData => {
 	const onCloseWsConnection = () => {
 		if (!executedDeploy) {
 			setPlayResultState(errorState);
+		} else {
+			setExecutedDeploy(null);
 		}
 	};
 
@@ -112,13 +114,17 @@ const useManagePlay = (): ManagePlayData => {
 			activeAccountWithBalance.public_key
 		);
 
-		const preparedDeploy = await preparePlayDeploy(
-			parsedActivePublicKey
-		);
-
 		try {
+			const preparedDeploy = await preparePlayDeploy(
+				parsedActivePublicKey
+			);
+
 			await signAndSendDeploy(preparedDeploy, parsedActivePublicKey);
-			setPlayResultState({ ...playResultState, loading: true });
+			setPlayResultState({
+				...playResultState,
+				loading: true,
+				error: false,
+			});
 			handleOpenConnection();
 		} catch (e) {
 			setPlayResultState(errorState);

client/src/app/services/hooks/use-websockets.ts

@@ -1,4 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
+import { isDeploy } from '../../utils/formatters';
 
 interface WebSocketMessage {
 	data: string;
@@ -9,7 +10,7 @@ interface UseWebSocketsProps {
 	onMessage: (message: WebSocketMessage) => void;
 	onClose: () => void;
 }
-
+const DISCONNECT_TIMEOUT = 60000;
 const logOpenWsConnection = () => console.log('open ws connection');
 
 export const useWebSockets = ({
@@ -21,6 +22,17 @@ export const useWebSockets = ({
 		null as unknown as WebSocket
 	);
 
+	let timeoutId;
+	function resetMessageTimeout() {
+		clearTimeout(timeoutId);
+		timeoutId = setTimeout(function () {
+			console.log(
+				'No deploy received for 1 min, closing connection...'
+			);
+			close();
+		}, DISCONNECT_TIMEOUT);
+	}
+
 	const addEventHandler = (
 		type: string,
 		callback: (value: any) => void
@@ -32,27 +44,49 @@ export const useWebSockets = ({
 		};
 	};
 
-	useEffect(() => addEventHandler('open', onOpen), [session, onOpen]);
 	useEffect(
-		() => addEventHandler('message', onMessage),
+		() =>
+			addEventHandler('open', () => {
+				onOpen && onOpen();
+				resetMessageTimeout();
+			}),
+		[session, onOpen]
+	);
+	useEffect(
+		() =>
+			addEventHandler('message', event => {
+				if (isDeploy(event.data)) {
+					onMessage(event);
+					resetMessageTimeout();
+				}
+			}),
 		[session, onMessage]
 	);
 	useEffect(
 		() => addEventHandler('close', onClose),
 		[session, onClose]
 	);
 
+	useEffect(
+		() =>
+			addEventHandler('error', () => {
+				close();
+			}),
+		[session]
+	);
+
 	const connect = useCallback((publicKey: string) => {
 		const url = `${config.lottery_api_ws_url}?caller_public_key=${publicKey}`;
 		const ws = new WebSocket(url);
 		setSession(ws);
 	}, []);
 
-	const close = useCallback(() => {
+	const close = () => {
 		if (session?.readyState === session?.OPEN) {
 			session?.close();
+			setSession(null as unknown as WebSocket);
 		}
-	}, [session]);
+	};
 
 	return { connect, close, readyState: session?.readyState };
 };

client/src/app/types/Round.ts

@@ -5,5 +5,5 @@ export interface Round {
 	roundId: string;
 	winnerAccountHash: string;
 	winnerPublicKey: string;
-	deployHash?: string;
+	lastPlayDeployHash: string;
 }