diff --git a/components/modals/connect-twitch-modal.tsx b/components/modals/connect-twitch-modal.tsx
deleted file mode 100644
index 62261d7..0000000
--- a/components/modals/connect-twitch-modal.tsx
+++ /dev/null
@@ -1,139 +0,0 @@
-"use client";
-
-import axios from "axios"
-import { db } from "@/lib/db";
-import { Button } from "@/components/ui/button";
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
-import { Input } from "@/components/ui/input";
-
-import * as z from "zod";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useForm } from "react-hook-form";
-import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
-import { useEffect, useState } from "react";
-import { useRouter } from "next/navigation";
-import { cn } from "@/lib/utils";
-
-
-const formSchema = z.object({
-  id: z.string().trim().min(12, {
-    message: "Client ID should be at least 12 characters."
-  }),
-  secret: z.string().trim().min(12, {
-    message: "Client secret should be at least 12 characters."
-  })
-});
-
-export const ConnectTwitchModal = () => {
-  const [isMounted, setIsMounted] = useState(false);
-  const [twitchError, setTwitchError] = useState("")
-
-  useEffect(() => {
-    setIsMounted(true);
-  }, []);
-  
-  const router = useRouter();
-  const form = useForm({
-    resolver: zodResolver(formSchema),
-    defaultValues: {
-      id: "",
-      secret: ""
-    }
-  });
-
-  const isLoading = form.formState.isSubmitting;
-  
-  if (!isMounted) {
-    return null;
-  }
-
-  const onSubmit = async (values: z.infer<typeof formSchema>) => {
-    setTwitchError("");
-
-    try {
-      const response = await axios.post("/api/settings/connections/twitch", values);
-      console.log(response.data);
-    } catch (error) {
-      setTwitchError("Invalid client id and client secret combination.");
-      console.log("[CONNECTIONS/TWITCH/POST]", error);
-      return;
-    }
-
-    form.reset();
-    router.refresh();
-    window.location.reload();
-  }
-
-  return (
-    <Dialog>
-      <DialogTrigger>
-        <Button>Connect Twitch</Button>
-      </DialogTrigger>
-      <DialogContent className="bg-white text-black p-0 overflow-hidden">
-        <DialogHeader className="pt-8 px-6">
-          <DialogTitle className="text-2xl text-center">Connect Your Twitch Account</DialogTitle>
-          <DialogDescription className="text-center">Provide permission to access your twitch account & read chat.</DialogDescription>
-        </DialogHeader>
-        <div className={cn("hidden", twitchError.length > 0 && "block px-5 py-2 bg-[#FF0000] text-center items-center justify-center")}>
-            {twitchError}
-        </div>
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onSubmit)}
-          className="space-y-8">
-            <div className="space-y-8 px-6">
-              <FormField 
-                control={form.control}
-                name="id"
-                render={({ field }) => (
-                  <FormItem>
-                    <FormLabel
-                    className="uppercase text-xs font-bold">
-                      Client ID
-                    </FormLabel>
-                    <FormControl>
-                      <Input
-                        disabled={isLoading}
-                        className="bg-white text-black"
-                        placeholder="Enter your client id"
-                        {...field}
-                      />
-                    </FormControl>
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-            </div>
-
-            <div className="space-y-8 px-6">
-              <FormField 
-                control={form.control}
-                name="secret"
-                render={({ field }) => (
-                  <FormItem>
-                    <FormLabel
-                    className="uppercase text-xs font-bold">
-                      Client secret
-                    </FormLabel>
-                    <FormControl>
-                      <Input
-                        disabled={isLoading}
-                        className="bg-white text-black"
-                        placeholder="Enter your client secret"
-                        {...field}
-                      />
-                    </FormControl>
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-              <DialogFooter className="bg-gray-100 px-6 py-4">
-                <Button disabled={isLoading}>Connect</Button>
-              </DialogFooter>
-            
-            </div>
-          </form>
-        </Form>
-      </DialogContent>
-    </Dialog>
-  );
-}
\ No newline at end of file
diff --git a/components/modals/tts-badge-filter-modal.tsx b/components/modals/tts-badge-filter-modal.tsx
deleted file mode 100644
index 249b129..0000000
--- a/components/modals/tts-badge-filter-modal.tsx
+++ /dev/null
@@ -1,109 +0,0 @@
-"use client";
-
-import axios from "axios"
-import { Button } from "@/components/ui/button";
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
-import { Input } from "@/components/ui/input";
-
-import * as z from "zod";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useForm } from "react-hook-form";
-import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from "@/components/ui/form";
-import { useEffect, useState } from "react";
-import { useRouter } from "next/navigation";
-import { Info } from "lucide-react";
-import { Toggle } from "../ui/toggle";
-import { TtsBadgeFilter, TwitchConnection } from "@prisma/client";
-
-const formSchema = z.object({
-  whitelist: z.string().trim().array(),
-  blacklist: z.string().trim().array()
-});
-
-export const TTSBadgeFilterModal = () => {
-  const [isMounted, setIsMounted] = useState(false);
-
-  useEffect(() => {
-    setIsMounted(true);
-  }, []);
-  
-  const router = useRouter();
-  const form = useForm({
-    resolver: zodResolver(formSchema),
-    defaultValues: {
-      whitelist: z.string().trim().array(),
-      blacklist: z.string().trim().array()
-    }
-  });
-
-  const isLoading = form.formState.isSubmitting;
-  
-  const onSubmit = async (values: z.infer<typeof formSchema>) => {
-    let response = null;
-
-    // try {
-    //   response = await axios.post("/api/settings/tts/filter/badges", values);
-    // } catch (error) {
-    //   console.log("[CONNECTIONS/TWITCH/POST]", error);
-    //   return;
-    // }
-
-    form.reset();
-    router.refresh();
-    window.location.reload();
-  }
-
-  if (!isMounted) {
-    return null;
-  }
-
-  const badges: TtsBadgeFilter[] = [] //(await axios.get("/api/settings/tts/filter/badges")).data
-  
-  return (
-    <Dialog>
-      <DialogTrigger>
-        <Button aria-label="Badge" variant="ttsmessagefilter" className="my-2">
-          <Info className="h-4 w-4 mx-1" />
-          Badge
-        </Button>
-      </DialogTrigger>
-      <DialogContent className="bg-white text-black p-0 overflow-hidden">
-        <DialogHeader className="pt-8 px-6">
-          <DialogTitle className="text-2xl text-center">TTS Badge Filter</DialogTitle>
-          <DialogDescription className="text-center">Limit messages spoken by TTS by badges.</DialogDescription>
-        </DialogHeader>
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onSubmit)}
-          className="space-y-10">
-            {badges.map((badge) => (
-              <div className="space-y-8 px-6">
-                <FormField
-                  key={badge.badgeId}
-                  control={form.control}
-                  name={badge.badgeId}
-                  render={({ field }) => {
-                      return (
-                        <FormItem>
-                          <Toggle
-                            aria-label="Badge"
-                            variant="simple"
-                            disabled={isLoading}
-                            className="my-2"
-                            {...field}>
-                            {badge.badgeId}
-                          </Toggle>
-                        </FormItem>
-                      )
-                    }}
-                />
-              </div>
-            ))}
-            <DialogFooter className="bg-gray-100 px-6 py-4">
-              <Button disabled={isLoading}>Save</Button>
-            </DialogFooter>
-          </form>
-        </Form>
-      </DialogContent>
-    </Dialog>
-  );
-}
\ No newline at end of file
diff --git a/components/modals/tts-cheers-filter-modal.tsx b/components/modals/tts-cheers-filter-modal.tsx
deleted file mode 100644
index e69de29..0000000
diff --git a/components/modals/tts-subscription-filter-modal.tsx b/components/modals/tts-subscription-filter-modal.tsx
deleted file mode 100644
index e69de29..0000000
diff --git a/components/modals/tts-username-filter-modal.tsx b/components/modals/tts-username-filter-modal.tsx
deleted file mode 100644
index e69de29..0000000
diff --git a/components/navigation/adminprofile.tsx b/components/navigation/adminprofile.tsx
index cd84269..beee0f8 100644
--- a/components/navigation/adminprofile.tsx
+++ b/components/navigation/adminprofile.tsx
@@ -6,10 +6,10 @@ import { useEffect, useState } from "react";
 import { useSession } from "next-auth/react";
 import { cn } from "@/lib/utils";
 import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
-import { Button } from "../ui/button";
+import { Button } from "@/components/ui/button";
 import { Check, ChevronsUpDown } from "lucide-react";
 import { User } from "@prisma/client";
-import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem } from "../ui/command";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem } from "@/components/ui/command";
 
 
 const AdminProfile = () => {
diff --git a/components/navigation/settings.tsx b/components/navigation/settings.tsx
index 3d4c3af..065b840 100644
--- a/components/navigation/settings.tsx
+++ b/components/navigation/settings.tsx
@@ -1,8 +1,8 @@
 import Link from "next/link";
-import { Button } from "../ui/button";
+import { Button } from "@/components/ui/button";
 import UserProfile from "./userprofile";
 import AdminProfile from "./adminprofile";
-import RoleGate from "../auth/role-gate";
+import RoleGate from "@/components/auth/role-gate";
 
 const SettingsNavigation = async () => {
   return (