116 lines
2.9 KiB
TypeScript
116 lines
2.9 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useRef, useState } from "react";
|
|
import { useParams } from "next/navigation";
|
|
import MessageBox from "@/components/MessageBox";
|
|
import AppSidebar from "@/components/Sidebar";
|
|
import Message from "@/types/message";
|
|
import useUser, { User } from "@/hooks/get-user";
|
|
import Cookies from "js-cookie";
|
|
import axios from "axios";
|
|
import { NumberMap, StringMap } from "@/types/typeUtils";
|
|
import ServerType from "@/types/server";
|
|
|
|
export default function Server() {
|
|
const { id: ip } = useParams<{ id: string }>();
|
|
const [server, setServer] = useState<undefined | ServerType>();
|
|
const wsRef = useRef<WebSocket | null>(null);
|
|
const [messages, setMessages] = useState<Message[]>([]);
|
|
const { user, loading } = useUser();
|
|
const [userList, setUserList] = useState<NumberMap<User>>({});
|
|
|
|
useEffect(() => {
|
|
if (!ip || !user || loading) return;
|
|
|
|
async function auth() {
|
|
const server_auth = (
|
|
(await axios.post("/api/auth", { server_ip: ip })).data as any
|
|
).token;
|
|
|
|
// Open the WebSocket connection
|
|
const ws = new WebSocket(`ws://${ip}:7080`);
|
|
wsRef.current = ws;
|
|
|
|
ws.onopen = () => {
|
|
console.log("Connected to WebSocket:", ip);
|
|
ws.send(
|
|
JSON.stringify({
|
|
version: "0.0.1",
|
|
auth_token: server_auth,
|
|
last_message: 0,
|
|
})
|
|
);
|
|
};
|
|
|
|
ws.onmessage = (m) => {
|
|
const data = JSON.parse(m.data);
|
|
console.log("Message received:", data);
|
|
|
|
if (data.version) {
|
|
setServer(data);
|
|
return;
|
|
}
|
|
|
|
switch (data.type) {
|
|
case "authenticated":
|
|
setMessages(data.params.messages);
|
|
|
|
case "message_create":
|
|
// setMessages([...messages, data.params]);
|
|
setMessages((prev) => [...prev, data.params]);
|
|
}
|
|
};
|
|
|
|
ws.onerror = (err) => {
|
|
console.error("WebSocket error:", err);
|
|
};
|
|
|
|
ws.onclose = () => {
|
|
console.log("WebSocket closed:", ip);
|
|
};
|
|
|
|
// Cleanup on unmount or id change
|
|
return () => {
|
|
ws.close();
|
|
};
|
|
}
|
|
|
|
auth();
|
|
setUserList((prev) => {
|
|
prev[user.id] = user;
|
|
return prev;
|
|
});
|
|
}, [ip, user, loading]);
|
|
|
|
return (
|
|
<AppSidebar
|
|
server={
|
|
{
|
|
channels: [{ id: "general", name: "General", kind: "text" }],
|
|
...server,
|
|
} as ServerType
|
|
}
|
|
>
|
|
<MessageBox
|
|
channelName="General"
|
|
userList={userList}
|
|
setUserList={setUserList}
|
|
messages={messages
|
|
.filter((m) => m.channel_id === "general")
|
|
.toReversed()}
|
|
sendMessage={(message) => {
|
|
wsRef.current?.send(
|
|
JSON.stringify({
|
|
type: "send_message",
|
|
params: {
|
|
channel_id: "general",
|
|
contents: message,
|
|
},
|
|
})
|
|
);
|
|
}}
|
|
/>
|
|
</AppSidebar>
|
|
);
|
|
}
|