add: added homepage

front/src/pages/Home.tsx

@@ -1,7 +1,56 @@
+import { useState, useEffect } from "react"
+import { Link } from "react-router-dom"
+import { Channels, User } from "../types"
+import axios from "axios"
+
 export default function Home() {
+    const [user, setUser] = useState<User>();
+    const [channels, setChannels] = useState<Channels>();
+
+    useEffect(() => {
+        const token = localStorage.getItem("token")
+        if (token) {
+            axios.post("/api/auth/me", {
+                token: token
+            }).then((res) => {
+                setUser(res.data)
+            }).catch((err) => {
+                console.error(err)
+            })
+        } 
+
+        axios.get("/api/channels").then((res) => {
+            setChannels(res.data)
+        }).catch((err) => {
+            console.error(err)
+        })
+    }, [])
+
     return (
         <div>
             <h1>Home</h1>
+            {user ? (
+                <div>
+                    <p>Welcome {user.username}</p>
+                    <button onClick={() => {
+                        localStorage.removeItem("token")
+                        window.location.reload()
+                    }}>Logout</button>
+                </div>
+            ) : (
+                <div>
+                    <Link to="/login">Login</Link>
+                    <Link to="/register">Register</Link>
+                </div>
+            )}
+            <h2>Channels</h2>
+            <ul>
+                {channels?.map((channel) => (
+                    <li key={channel.id}>
+                        <Link to={`/channels/${channel.name}`}>{channel.name}</Link>
+                    </li>
+                ))}
+            </ul>
         </div>
     )
 }