diff --git a/src/lib/components/Browse/DrawerCreateChannel.svelte b/src/lib/components/Browse/DrawerCreateChannel.svelte
index 09162087..6f0fa428 100644
--- a/src/lib/components/Browse/DrawerCreateChannel.svelte
+++ b/src/lib/components/Browse/DrawerCreateChannel.svelte
@@ -64,6 +64,12 @@
 		newChannel = newChannel
 	}
 
+	const onTagValidation = (evt: any) => {
+		if (Number(evt.target.value) < 1) {
+			evt.target.setCustomValidity('Please fill out this field.')
+		}
+	}
+
 	let refToggle: any
 	const toggleDrawer = () => {
 		if (refToggle) {
@@ -161,6 +167,16 @@
 								id="tags"
 								placeholder={newChannel.tags.length > 0 ? '' : 'Tag'} />
 							<span class="absolute right-0 top-1/2 text-gray-400 pr-3">({maxTagLabel})</span>
+							{#if newChannel.tags.length === 0}
+								<input
+									type="number"
+									name="mintags"
+									required
+									min="1"
+									class="opacity-0 pointer-events-none absolute left-0 right-0 mx-auto bottom-0"
+									bind:value={newChannel.tags.length}
+									on:invalid={onTagValidation} />
+							{/if}
 						</div>
 						<div class="relative">
 							<input
diff --git a/src/lib/components/Browse/Sections/SectionCarousel.svelte b/src/lib/components/Browse/Sections/SectionCarousel.svelte
index b5288bef..4840d895 100644
--- a/src/lib/components/Browse/Sections/SectionCarousel.svelte
+++ b/src/lib/components/Browse/Sections/SectionCarousel.svelte
@@ -7,9 +7,10 @@
 	import ItemCarousel from '$lib/components/Browse/Sections/ItemCarousel.svelte'
 	import 'swiper/css'
 
-	export let channels: any = []
+	export let channels: any = undefined
 
 	let swiper: Swiper
+	let isMounted = false
 
 	const initSwiper = () => {
 		swiper = new Swiper('.carousel', {
@@ -37,11 +38,18 @@
 	}
 
 	onMount(async () => {
-		initSwiper()
+		channels.then((data: any) => {
+			if(data.length){
+				initSwiper()
+				isMounted = true
+			}
+		})
 	})
+
+	$: swiperClass = isMounted ? 'opacity-1' : 'opacity-0'
 </script>
 
-{#if channels.length == 0}
+{#await channels}
 	<div class="flex flex-col my-4 relative overflow-x-auto scrollbar-hide">
 		<div role="status" class="flex flex-row gap-1 animate-pulse">
 			{#each Array(5) as _, index (index)}
@@ -49,23 +57,27 @@
 			{/each}
 		</div>
 	</div>
-{:else}
-	<div class="relative p-1">
-		<div class="btn btn-square p-2 btn-prev absolute top-2/4 left-1 z-10 ml-3">
-			<IconDrawerLeft />
-		</div>
-		<div class="swiper carousel !pt-10 mx-8">
-			<div class="swiper-wrapper">
-				{#each channels as channel}
-					<ItemCarousel {channel} />
-				{/each}
+{:then value}
+	{#if value?.length > 0}
+		<div class={'relative p-1 transition-opacity ease-in duration-100 ' + swiperClass}>
+			<div class="btn btn-square p-2 btn-prev absolute top-2/4 left-1 z-10 ml-3">
+				<IconDrawerLeft />
+			</div>
+			<div class="swiper carousel !pt-10 mx-8">
+				<div class="swiper-wrapper">
+					{#each value as channel}
+						<ItemCarousel {channel} />
+					{/each}
+				</div>
+			</div>
+			<div class="btn btn-square z-10 p-2 btn-next absolute top-2/4 right-1 mr-3">
+				<IconDrawerChevron />
 			</div>
 		</div>
-		<div class="btn btn-square z-10 p-2 btn-next absolute top-2/4 right-1 mr-3">
-			<IconDrawerChevron />
-		</div>
-	</div>
-{/if}
+	{:else}
+		<div />
+	{/if}
+{/await}
 
 <style>
 	:global(.swiper-slide) {
diff --git a/src/lib/components/Browse/Sections/SectionUser.svelte b/src/lib/components/Browse/Sections/SectionUser.svelte
index dc561ac2..5a6427d8 100644
--- a/src/lib/components/Browse/Sections/SectionUser.svelte
+++ b/src/lib/components/Browse/Sections/SectionUser.svelte
@@ -56,15 +56,9 @@
 				<div
 					bind:this={ref}
 					class="relative w-full flex gap-6 snap-x scrollbar-hide snap-mandatory overflow-x-auto flex-grow mx-14">
-					{#if sectionId === 'rising-stars'}
-						{#each value.users as user}
-							<ItemUser {user} />
-						{/each}
-					{:else}
-						{#each value as user}
-							<ItemUser {user} />
-						{/each}
-					{/if}
+					{#each value as user}
+						<ItemUser {user} />
+					{/each}
 				</div>
 
 				<div class="relative flex items-center mr-3">
diff --git a/src/lib/components/Channel/Chat/DrawerChat.svelte b/src/lib/components/Channel/Chat/DrawerChat.svelte
index a1e09a29..97fc4a1b 100644
--- a/src/lib/components/Channel/Chat/DrawerChat.svelte
+++ b/src/lib/components/Channel/Chat/DrawerChat.svelte
@@ -7,20 +7,12 @@
 	import { onDestroy, onMount } from 'svelte'
 	import { is_chat_drawer_open, was_chat_drawer_closed } from '$lib/stores/channelStore'
 	import { emitChatHistoryToChannel } from '$lib/websocket'
+	import { setRole } from '$lib/utils'
 
 	export let channel: any = undefined,
 		showEditChannelDrawer: boolean = false
 	let chatHistory: any[] = []
 
-	const setRole = (msg: any): any => {
-		if (msg.user?.userId === 'AI') msg.role = '🤖 AI'
-		else if (msg.user?.userId === channel?.user) msg.role = 'Host'
-		else if (channel?.mods?.includes(msg.user._id)) msg.role = 'Mod'
-		else if (msg.user?.userId === $page.data.user?.userId) msg.role = 'You'
-		else msg.role = 'Rando'
-		return msg
-	}
-
 	channel_message.subscribe((value) => {
 		if (!value) return
 		var parsedMsg = JSON.parse(value)
@@ -29,8 +21,12 @@
 				chatHistory = []
 				// if (Array.isArray(parsedMsg.data)) {
 				parsedMsg.data.forEach((message: any) => {
-					const updatedMsgWithRole = setRole(message)
-					chatHistory.push(updatedMsgWithRole)
+					message.role = setRole({
+						userId: message.user.userId,
+						channel,
+						currentUserId: $page.data.user?.userId
+					})
+					chatHistory.push(message)
 				})
 				// } else {
 				// 	parsedMsg = setRole(JSON.parse(parsedMsg.data))
@@ -39,7 +35,11 @@
 			} else if (parsedMsg.isMessageDeleted) {
 				chatHistory = chatHistory.filter((item) => item.timestamp !== parsedMsg.data.timestamp)
 			} else {
-				parsedMsg = setRole(parsedMsg)
+				parsedMsg.role = setRole({
+					userId: parsedMsg.user.userId,
+					channel,
+					currentUserId: $page.data.user?.userId
+				})
 				chatHistory.unshift(parsedMsg)
 			}
 			chatHistory = chatHistory
diff --git a/src/lib/components/Channel/Chat/Message.svelte b/src/lib/components/Channel/Chat/Message.svelte
index 4b92145e..1eae0c84 100644
--- a/src/lib/components/Channel/Chat/Message.svelte
+++ b/src/lib/components/Channel/Chat/Message.svelte
@@ -14,8 +14,20 @@
 	export let sender: any, hostId: string, channel: any
 
 	$: coloredRole = getColoredRole(sender.role)
+
 	$: isGuest = channel?.guests?.includes(sender.user?.userId)
 
+	$: showBanItem =
+		hostId === $page.data.user?.userId &&
+		sender.user?.userId !== $page.data.user?.userId &&
+		channel?.mods?.includes($page.data.user?.userId) &&
+		sender.role !== '🤖 AI'
+
+	$: showRoleItem =
+		hostId === $page.data.user?.userId &&
+		sender.user?.userId !== $page.data.user?.userId &&
+		sender.role !== '🤖 AI'
+
 	const deleteMessage = () => {
 		if (sender.user?.userId === hostId || sender.user?.userId === $page.data.user?.userId) {
 			var channelId = sender.eventName.split('-').pop()
@@ -61,13 +73,11 @@
 	}
 </script>
 
-<!-- <ProfileCard /> -->
-
 <ul class="menu">
 	<li class="group relative dropdown">
 		<!--Host, Mod, You or Rando-->
 		<div class="p-1 border border-transparent rounded-lg flex gap-2 overflow-x-hidden">
-			<span>
+			<label>
 				{#if sender.role === '🤖 AI' || sender.role === 'Host' || sender.role === 'Mod' || sender.role === 'You'}
 					<span class="{coloredRole.tagColor} rounded-sm text-sm px-[5px] py-[2px] text-white"
 						>{sender.role}</span>
@@ -78,7 +88,10 @@
 						class="{coloredRole.textColor} font-medium">@{sender.user?.username}</span>
 				{/if}
 				<span class="break-all">{sender.message}</span>
-			</span>
+			</label>
+			<!-- <ul class="dropdown-content menu p-2 shadow bg-base-200 rounded-box w-52">
+				<ProfileCard userId={sender.user?.userId} />
+			</ul> -->
 			<div
 				class="group-hover:block dropdown-menu absolute hidden right-0 dropdown dropdown-left dropdown-end"
 				tabindex="1">
@@ -88,22 +101,22 @@
 				<ul tabindex="1" class="dropdown-content menu p-2 shadow bg-base-200 rounded-box w-52">
 					<li class="disabled"><a><IconChatReact /> React </a></li>
 					<li class="disabled"><a><IconChatQuote /> Quote </a></li>
-					{#if hostId === $page.data.user?.userId && sender.user?.userId !== $page.data.user?.userId && channel?.mods?.includes($page.data.user?.userId)}
+					{#if showBanItem}
 						<li>
 							<a on:click={() => toggleBan()}
 								><IconChatBan /> {channel.bans?.includes(sender.user?.userId) ? 'Unban' : 'Ban'}
 							</a>
 						</li>
 					{/if}
-					{#if hostId === $page.data.user?.userId && sender.user?.userId !== $page.data.user?.userId}
+					{#if showRoleItem}
 						<li>
 							<a on:click={() => toggleMod()}
-								><IconChatMod /> {sender.role === 'Mod' ? 'Remove Mod' : 'Grant Mod'}
+								><IconChatMod /> {sender.role === 'Mod' ? 'Revoke Mod' : 'Grant Mod'}
 							</a>
 						</li>
 						<li>
 							<a on:click={() => toggleGuest()}
-								><IconChatGuest /> {isGuest ? 'Revoke Guest' : 'Guest'}
+								><IconChatGuest /> {isGuest ? 'Revoke Guest' : 'Grant Guest'}
 							</a>
 						</li>
 					{/if}
diff --git a/src/lib/components/Channel/Chat/ProfileCard.svelte b/src/lib/components/Channel/Chat/ProfileCard.svelte
index 1005e761..487231b0 100644
--- a/src/lib/components/Channel/Chat/ProfileCard.svelte
+++ b/src/lib/components/Channel/Chat/ProfileCard.svelte
@@ -1,48 +1,61 @@
-<div
-	data-popover
-	role="tooltip"
-	class="absolute z-10 invisible inline-block w-64 text-sm font-light text-gray-500 transition-opacity duration-300 bg-white border border-gray-200 rounded-lg shadow-sm opacity-0 dark:text-gray-400 dark:bg-gray-800 dark:border-gray-600">
-	<div class="p-3">
-		<div class="flex items-center justify-between mb-2">
-			<a href="">
-				<img
-					class="w-10 h-10 rounded-full"
-					src="/docs/images/people/profile-picture-1.jpg"
-					alt="Jese Leos" />
-			</a>
-			<div>
-				<button
-					type="button"
-					class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-xs px-3 py-1.5 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800"
-					>Follow</button>
+<script lang="ts">
+	import { get } from '$lib/api'
+	import { onMount } from 'svelte'
+
+	export let userId: string
+	let profile: any
+
+	onMount(async () => {
+		profile = await get(`users/search/id?userId=${userId}`)
+	})
+</script>
+
+{#if !profile}
+	<progress class="progress w-full" />
+{:else}
+	<div
+		data-popover
+		role="tooltip"
+		class="absolute z-10 invisible inline-block w-64 text-sm font-light text-gray-500 transition-opacity duration-300 bg-white border border-gray-200 rounded-lg shadow-sm opacity-0 dark:text-gray-400 dark:bg-gray-800 dark:border-gray-600">
+		<div class="p-3">
+			<div class="flex items-center justify-between mb-2">
+				<a href="">
+					<img class="w-10 h-10 rounded-full" src={profile.avatar} alt="Jese Leos" />
+				</a>
+				<div>
+					<button
+						type="button"
+						class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-xs px-3 py-1.5 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800"
+						>Follow</button>
+				</div>
 			</div>
+			<p class="text-base font-semibold leading-none text-gray-900 dark:text-white">
+				<a href="">Jese Leos</a>
+			</p>
+			<p class="mb-3 text-sm font-normal">
+				<a href="" class="hover:underline">@jeseleos</a>
+			</p>
+			<p class="mb-4 text-sm font-light">
+				Open-source contributor. Building <a
+					href=""
+					class="text-blue-600 dark:text-blue-500 hover:underline">flowbite.com</a
+				>.
+			</p>
+			<ul class="flex text-sm font-light">
+				<li class="mr-2">
+					<a href="" class="hover:underline">
+						<span class="font-semibold text-gray-900 dark:text-white">799</span>
+						<span>Following</span>
+					</a>
+				</li>
+				<li>
+					<a href="" class="hover:underline">
+						<span class="font-semibold text-gray-900 dark:text-white">3,758</span>
+						<span>Followers</span>
+					</a>
+				</li>
+			</ul>
 		</div>
-		<p class="text-base font-semibold leading-none text-gray-900 dark:text-white">
-			<a href="">Jese Leos</a>
-		</p>
-		<p class="mb-3 text-sm font-normal">
-			<a href="" class="hover:underline">@jeseleos</a>
-		</p>
-		<p class="mb-4 text-sm font-light">
-			Open-source contributor. Building <a
-				href=""
-				class="text-blue-600 dark:text-blue-500 hover:underline">flowbite.com</a
-			>.
-		</p>
-		<ul class="flex text-sm font-light">
-			<li class="mr-2">
-				<a href="" class="hover:underline">
-					<span class="font-semibold text-gray-900 dark:text-white">799</span>
-					<span>Following</span>
-				</a>
-			</li>
-			<li>
-				<a href="" class="hover:underline">
-					<span class="font-semibold text-gray-900 dark:text-white">3,758</span>
-					<span>Followers</span>
-				</a>
-			</li>
-		</ul>
+		<div data-popper-arrow />
 	</div>
-	<div data-popper-arrow />
-</div>
+{/if}
diff --git a/src/lib/components/Channel/Stream/CommandList.svelte b/src/lib/components/Channel/Stream/CommandList.svelte
index 1483fd79..b5554820 100644
--- a/src/lib/components/Channel/Stream/CommandList.svelte
+++ b/src/lib/components/Channel/Stream/CommandList.svelte
@@ -1,6 +1,4 @@
-<div
-	class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 transition-all animate-pulse">
-	<span class="flex items-center justify-center mb-4">Slash commands coming soon...</span>
+<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 transition-all">
 	<div class="grid grid-cols-2 gap-2">
 		<div class="grid grid-rows-3 gap-y-4">
 			<div class="flex items-center justify-end">Toggle mod status</div>
diff --git a/src/lib/components/Channel/Stream/StreamControls.svelte b/src/lib/components/Channel/Stream/StreamControls.svelte
index 6e219abf..6852defb 100644
--- a/src/lib/components/Channel/Stream/StreamControls.svelte
+++ b/src/lib/components/Channel/Stream/StreamControls.svelte
@@ -86,7 +86,7 @@
 				meta: {
 					name: `${$page.params.channelId}-${$page.data.user.userId}-screen`
 				},
-				recording: { mode: 'automatic' }
+				recording: { mode: 'off' }
 			}
 		})
 		screenUid = liveInput.uid
@@ -136,7 +136,7 @@
 				meta: {
 					name: `${$page.params.channelId}-${$page.data.user.userId}-webcam`
 				},
-				recording: { mode: 'automatic' }
+				recording: { mode: 'off' }
 			}
 		})
 		webcamUid = liveInput.uid
@@ -186,7 +186,7 @@
 				meta: {
 					name: `${$page.params.channelId}-${$page.data.user.userId}-audio`
 				},
-				recording: { mode: 'automatic' }
+				recording: { mode: 'off' }
 			}
 		})
 		audioUid = liveInput.uid
diff --git a/src/lib/components/Channel/Stream/VideoGrid.svelte b/src/lib/components/Channel/Stream/VideoGrid.svelte
index 6fa81cde..609a1a4e 100644
--- a/src/lib/components/Channel/Stream/VideoGrid.svelte
+++ b/src/lib/components/Channel/Stream/VideoGrid.svelte
@@ -5,7 +5,6 @@
 
 	export let channel: any
 
-	const sender: any = {}
 	$: grid = getVideoGrids($video_items, 9)
 </script>
 
@@ -16,7 +15,7 @@
 				{#each grid as row}
 					<div class="flex flex-row gap-4 justify-center h-full mt-3">
 						{#each row as video}
-							<VideoItem bind:video {channel} {sender} />
+							<VideoItem bind:video {channel} />
 						{/each}
 					</div>
 				{/each}
diff --git a/src/lib/components/Channel/Stream/VideoItem.svelte b/src/lib/components/Channel/Stream/VideoItem.svelte
index 2af8b230..0c7b6ea0 100644
--- a/src/lib/components/Channel/Stream/VideoItem.svelte
+++ b/src/lib/components/Channel/Stream/VideoItem.svelte
@@ -3,16 +3,18 @@
 	import WHIPClient from '$lib/WHIPClient'
 	import { onMount } from 'svelte'
 	import { page } from '$app/stores'
-	// import IconChatMod from '$lib/assets/icons/chat/IconChatMod.svelte'
-	// import IconChatGuest from '$lib/assets/icons/chat/IconChatGuest.svelte'
-	// import { emitChannelUpdate } from '$lib/websocket'
-	// import { getColoredRole } from '$lib/utils'
+	import IconChatMod from '$lib/assets/icons/chat/IconChatMod.svelte'
+	import IconChatGuest from '$lib/assets/icons/chat/IconChatGuest.svelte'
 	import { draggable } from '@neodrag/svelte'
 	import { is_sharing_audio, is_sharing_screen, is_sharing_webcam } from '$lib/stores/streamStore'
+	import { emitChannelUpdate } from '$lib/websocket'
+	import { getColoredRole, setRole } from '$lib/utils'
+	import IconChatBan from '$lib/assets/icons/chat/IconChatBan.svelte'
 
-	export let video: any, channel: any, sender: any
+	export let video: any, channel: any
 
-	let coloredRole: any = {},
+	let role = '',
+		coloredRole: any = {},
 		isGuest = false,
 		screenElement: HTMLVideoElement,
 		webcamElement: HTMLVideoElement,
@@ -30,6 +32,17 @@
 		isWebcamFocused: boolean = false,
 		speakingValue: number = 0
 
+	$: showBanItem =
+		channel.user === $page.data.user?.userId &&
+		video._id !== $page.data.user?.userId &&
+		channel?.mods?.includes($page.data.user?.userId) &&
+		role !== '🤖 AI'
+
+	$: showRoleItem =
+		channel.user === $page.data.user?.userId &&
+		video._id !== $page.data.user?.userId &&
+		role !== '🤖 AI'
+
 	$: if (isMounted && video.screen !== prevScreen) {
 		handleScreenChanges()
 	}
@@ -158,24 +171,10 @@
 		isWebcamFocused = false
 	}
 
-	// const initializeAndHandleChanges = () => {
-	// 	if (!prevScreen) {
-	// 		prevScreen = video.screen
-	// 		handleScreenChanges()
-	// 	}
-	// 	if (!prevWebcam) {
-	// 		prevWebcam = video.webcam
-	// 		handleWebcamChanges()
-	// 	}
-	// 	if (!prevAudio) {
-	// 		prevAudio = video.audio
-	// 		handleAudioChanges()
-	// 	}
-	// }
-
 	onMount(() => {
-		// coloredRole = getColoredRole(sender.role)
-		// isGuest = channel?.guests?.includes(sender.userData?.userId)
+		role = setRole({ userId: video._id, channel, currentUserId: $page.data.user?.userId })
+		coloredRole = getColoredRole(role)
+		isGuest = channel?.guests?.includes(video._id)
 		screenElement = document.getElementById(`screen-${video._id}`) as HTMLVideoElement
 		webcamElement = document.getElementById(`webcam-${video._id}`) as HTMLVideoElement
 		audioElement = document.getElementById(`audio-${video._id}`) as HTMLAudioElement
@@ -227,23 +226,35 @@
 		}
 	})
 
-	// const toggleMod = () => {
-	// 	if (channel.mods.includes(sender.userData?.userId)) {
-	// 		channel.mods = channel.mods.filter((mod: string) => mod !== sender.userData?.userId)
-	// 	} else {
-	// 		channel.mods.push(sender.userData?.userId)
-	// 	}
-	// 	emitChannelUpdate({ channel })
-	// }
+	const toggleBan = () => {
+		if (channel.bans.includes(video._id)) {
+			channel.bans = channel.bans.filter((ban: string) => ban !== video._id)
+		} else {
+			channel.bans.push(video._id)
+			channel.guests = channel.guests.filter((guest: string) => guest !== video._id)
+			channel.mods = channel.mods.filter((mod: string) => mod !== video._id)
+			isGuest = false
+		}
+		emitChannelUpdate({ channelSocket: channel.socket, channel })
+	}
 
-	// const toggleGuest = () => {
-	// 	if (channel.guests.includes(sender.userData?.userId)) {
-	// 		channel.guests = channel.guests.filter((guest: string) => guest !== sender.userData?.userId)
-	// 	} else {
-	// 		channel.guests.push(sender.userData?.userId)
-	// 	}
-	// 	emitChannelUpdate({ channel })
-	// }
+	const toggleMod = () => {
+		if (channel.mods.includes(video._id)) {
+			channel.mods = channel.mods.filter((mod: string) => mod !== video._id)
+		} else {
+			channel.mods.push(video._id)
+		}
+		emitChannelUpdate({ channelSocket: channel.socket, channel })
+	}
+
+	const toggleGuest = () => {
+		if (channel.guests.includes(video._id)) {
+			channel.guests = channel.guests.filter((guest: string) => guest !== video._id)
+		} else {
+			channel.guests.push(video._id)
+		}
+		emitChannelUpdate({ channelSocket: channel.socket, channel })
+	}
 
 	$: animate = isWebcamFocused ? '' : 'transition-all'
 </script>
@@ -267,18 +278,32 @@
 			</div>
 			<video id={`audio-${video._id}`} autoplay muted class="rounded-md w-0 h-0" />
 			<div class="absolute left-2 bottom-2 rounded-md dropdown">
-				<label tabindex="0" class="btn btn-sm normal-case {speakingValue > 10 ? 'btn-outline' : ''}"
-					>@{video.username}</label>
-				<!-- <ul tabindex="0" class="dropdown-content menu p-2 shadow bg-base-200 rounded-box w-52">
-					<li>
-						<a on:click={() => toggleMod()}
-							><IconChatMod /> {sender?.role === 'Mod' ? 'Remove Mod' : 'Grant Mod'}
-						</a>
-					</li>
-					<li>
-						<a on:click={() => toggleGuest()}><IconChatGuest /> Revoke Guest </a>
-					</li>
-				</ul> -->
+				<label
+					tabindex="0"
+					class="{coloredRole.textColor} bg-base-100 btn btn-sm normal-case {speakingValue > 10
+						? 'btn-outline'
+						: 'border-transparent'}">@{video.username}</label>
+				{#if showBanItem || showRoleItem}
+					<ul tabindex="0" class="dropdown-content menu p-2 shadow bg-base-200 rounded-box w-52">
+						{#if showBanItem}
+							<li>
+								<a on:click={() => toggleBan()}
+									><IconChatBan /> {channel.bans?.includes(video._id) ? 'Unban' : 'Ban'}
+								</a>
+							</li>
+						{/if}
+						{#if showRoleItem}
+							<li>
+								<a on:click={() => toggleMod()}
+									><IconChatMod /> {role === 'Mod' ? 'Revoke Mod' : 'Grant Mod'}
+								</a>
+							</li>
+							<li>
+								<a on:click={() => toggleGuest()}><IconChatGuest /> Revoke Guest </a>
+							</li>
+						{/if}
+					</ul>
+				{/if}
 			</div>
 		</div>
 	</div>
diff --git a/src/lib/components/Search/ItemSearchUser.svelte b/src/lib/components/Search/ItemSearchUser.svelte
index 9c69021a..f4b90bc1 100644
--- a/src/lib/components/Search/ItemSearchUser.svelte
+++ b/src/lib/components/Search/ItemSearchUser.svelte
@@ -11,7 +11,7 @@
 			<div class="flex-col md:flex-row gap-4 w-full contents">
 				<div class="max-w-md">
 					<div class="avatar">
-						<div class="mask mask-squircle">
+						<div class="w-32 mask mask-squircle">
 							<img loading="lazy" src={item.avatar} alt="" />
 						</div>
 					</div>
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 1b692b90..06cce401 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -79,7 +79,8 @@ export const getSectionUrl = ({
 			return `users/highest-ranked?searchQuery=${query}&skip=${skip}&limit=${limit}`
 		case 'rising-stars':
 			//stats/stream/getRisingStars?skip=${0}&limit=${10}
-			return `users/rising-stars?searchQuery=${query}&skip=${skip}&limit=${limit}`
+			//users/rising-stars?searchQuery=${query}&skip=${skip}&limit=${limit}
+			return `stats/stream/rising-stars?skip=${skip}&limit=${limit}`
 		case 'my':
 			return `channels/user?searchQuery=${query}&skip=${skip}&limit=${limit}`
 		case 'fav':
@@ -98,6 +99,22 @@ export const copyToClipboard = async (text: string) => {
 	}
 }
 
+export const setRole = ({
+	userId,
+	channel,
+	currentUserId
+}: {
+	userId: any
+	channel: any
+	currentUserId: string
+}): any => {
+	if (userId === 'AI') return '🤖 AI'
+	else if (userId === channel?.user) return 'Host'
+	else if (channel?.mods?.includes(userId)) return 'Mod'
+	else if (userId === currentUserId) return 'You'
+	else return 'Rando'
+}
+
 export const getColoredRole = (role: string) =>
 	({
 		'🤖 AI': {
diff --git a/src/routes/browse/+page.server.ts b/src/routes/browse/+page.server.ts
index cb9693af..c7df2143 100644
--- a/src/routes/browse/+page.server.ts
+++ b/src/routes/browse/+page.server.ts
@@ -5,10 +5,6 @@ import { getSectionUrl } from '$lib/utils'
 
 export const load = (async ({ locals }) => {
 	return {
-		// tableChannels: get(`channels?skip=${0}&limit=${100}`),
-		mostActiveChannels: get(
-			getSectionUrl({ sectionId: 'most-active', query: '', skip: 0, limit: 5 })
-		),
 		lazy: {
 			mostActiveChannels: get(
 				getSectionUrl({ sectionId: 'most-active', query: '', skip: 0, limit: 5 })
diff --git a/src/routes/browse/+page.svelte b/src/routes/browse/+page.svelte
index 3a5191c4..a9395aa9 100644
--- a/src/routes/browse/+page.svelte
+++ b/src/routes/browse/+page.svelte
@@ -11,7 +11,7 @@
 	$: user = $page.data.user
 </script>
 
-<SectionCarousel bind:channels={data.mostActiveChannels} />
+<SectionCarousel bind:channels={data.lazy.mostActiveChannels} />
 <SearchBar />
 
 <SectionChannel sectionId={'weekly'} bind:channels={data.lazy.weeklyChannels} />