add: added channel delete button

front/src/pages/ChannelPage.tsx

@@ -1,4 +1,4 @@
-import { useParams, Link } from "react-router-dom";
+import { useParams, Link, useNavigate } from "react-router-dom";
 import React, { useEffect, useState } from "react";
 import { Channel, Messages, User } from "../types";
 import TopBar from "../components/TopBar";
@@ -8,6 +8,7 @@ import axios from "axios";
 import "../styles/ChannelPage.css";
 
 export default function ChannelPage({socket}: {socket: WebSocket}) {
+    const navigate = useNavigate();
     const { name } = useParams();
     const [channel, setChannel] = useState<Channel>();
     const [messages, setMessages] = useState<Messages>();
@@ -48,6 +49,17 @@ export default function ChannelPage({socket}: {socket: WebSocket}) {
         );
     }
 
+    function deleteChannel() {
+        axios
+            .post(`/api/channels/${name}/delete`, { token })
+            .then(() => {
+                navigate("/");
+            })
+            .catch((err) => {
+                console.error(err.response);
+            });
+    }
+
     useEffect(() => {
         const localToken = localStorage.getItem("token");
         if (localToken) {
@@ -75,6 +87,9 @@ export default function ChannelPage({socket}: {socket: WebSocket}) {
                         setMessages(res.data)
                     })
             }
+            if (data.type === "delete_channel" && data.channel_id === channel?.id) {
+                navigate("/");
+            }
         });
     }, [channel])
 
@@ -124,6 +139,11 @@ export default function ChannelPage({socket}: {socket: WebSocket}) {
                         Purge Channel
                     </button>
                 )}
+                {user?.admin == 1 && (
+                    <button onClick={deleteChannel}>
+                        Delete Channel
+                    </button>
+                )}
                 {token ? (
                     <form onSubmit={handleSubmit} className="message-form">
                         <input