diff --git a/src/components/Message.tsx b/src/components/Message.tsx index 5aa1ddb..41e00ec 100644 --- a/src/components/Message.tsx +++ b/src/components/Message.tsx @@ -1,5 +1,5 @@ import { FunctionComponent } from "react"; -import { TextMessage } from "src/lib/types/ServerMessage"; +import { TextMessage } from "src/lib/ServerMessage"; type Props = { message: TextMessage; diff --git a/src/lib b/src/lib index 9fc4e8f..f7cfeb9 160000 --- a/src/lib +++ b/src/lib @@ -1 +1 @@ -Subproject commit 9fc4e8f80d335abc3ab02bfc24d64afcc91f3567 +Subproject commit f7cfeb92bd3b6f7387e712595ec16ed02776e0cf diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 399fd65..3282a9a 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -4,16 +4,17 @@ import useWebSocket, { ReadyState as WebSocketReadyState, } from "react-use-websocket"; import MessageComponent from "src/components/Message"; -import { MessageType, TextMessage } from "src/lib/types/ServerMessage"; -import { isServerMessage, isTextMessage } from "src/lib/types/ServerMessage"; +import type { TextMessage } from "src/lib/ServerMessage"; +import { + isServerMessage, + isTextMessage, + MessageType, +} from "src/lib/ServerMessage"; export default function Index(): JSX.Element { - const [enableSSL, setEnableSSL] = useState(true); - const protocol = enableSSL ? "wss" : "ws"; - const [count, setCount] = useState(0); const [messageHistory, setMessageHistory] = useState([]); - const [socketUrl, setSocketUrl] = useState("localhost:8989/"); + const [socketUrl, setSocketUrl] = useState("wss.tobot.tk:8085/"); function onMessage(event: MessageEvent): void { const message = JSON.parse(event.data); @@ -29,7 +30,7 @@ export default function Index(): JSX.Element { } let keepAliveInterval: NodeJS.Timeout; - const websocket = useWebSocket(protocol + ":" + socketUrl, { + const websocket = useWebSocket("wss://" + socketUrl, { onMessage, onOpen() { keepAliveInterval = setInterval(() => { @@ -47,7 +48,7 @@ export default function Index(): JSX.Element { const handleClickSendMessage = useCallback(() => { setCount(count + 1); const message: TextMessage = { - author: "AUTHOR NOT IMPLEMENTED YET", + author: -1, type: MessageType.TEXT, date: Date.now(), content: `Hello, world! ${count}`, @@ -58,7 +59,7 @@ export default function Index(): JSX.Element { const trySetSocketUrl = useCallback( (url: string) => { try { - console.log(new URL(protocol + ":" + url), url); + console.log(new URL("wss://" + url), url); setSocketUrl(url); } catch (e) { console.debug("Invalid URL"); @@ -69,19 +70,11 @@ export default function Index(): JSX.Element { } } }, - [websocket, protocol] + [websocket] ); - const toggleSSL = useCallback(() => { - setEnableSSL(!enableSSL); - trySetSocketUrl(socketUrl.replace(/^wss?/, protocol)); - }, [enableSSL, socketUrl, trySetSocketUrl, protocol]); - return ( <> - - Ready state: {ReadyState[websocket.readyState]} ({websocket.readyState}) -
{messageHistory.map((message, idx) => { @@ -89,6 +82,10 @@ export default function Index(): JSX.Element { })}
+ Ready state: + + {ReadyState[websocket.readyState]} ({websocket.readyState}) + trySetSocketUrl(e.target.value)} /> - -