diff --git a/CHANGELOG-nightly.md b/CHANGELOG-nightly.md
index 76fc78f31..306fc9040 100644
--- a/CHANGELOG-nightly.md
+++ b/CHANGELOG-nightly.md
@@ -2,12 +2,17 @@
 
 **The changes listed here are not assigned to an official release**.
 
+-   No unreleased changes yet.
+
+### Version 3.0.8.1000
+
 -   Enabled AVIF images on Firefox >= 113 by default
 -   Added sub duration & account creation date in the User Card
 -   Added a button to open an emote's full page from the emote card
 -   Fixed an issue where clicking the upper drag region in the User Card opened the user's channel
 -   Fixed user card content overflowing due to long messages
 -   Fixed chat scroller being visible in the viewer list
+-   Tentatively fixed an issue which caused the sidebar to crash occasionally
 
 ### Version 3.0.7.1000
 
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2bf6d0ce4..b010a525a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,13 @@
+### Version 3.0.8
+
+-   Enabled AVIF images on Firefox >= 113 by default
+-   Added sub duration & account creation date in the User Card
+-   Added a button to open an emote's full page from the emote card
+-   Fixed an issue where clicking the upper drag region in the User Card opened the user's channel
+-   Fixed user card content overflowing due to long messages
+-   Fixed chat scroller being visible in the viewer list
+-   Tentatively fixed an issue which caused the sidebar to crash occasionally
+
 ### Version 3.0.7
 
 -   Added a new User Card
diff --git a/index.html b/index.html
index c8b171f61..70ba3f6d8 100644
--- a/index.html
+++ b/index.html
@@ -24,6 +24,6 @@
 			>
 		</noscript>
 		<div id="app"></div>
-		<script type="module" src="src/options/options.ts"></script>
+		<script type="module" src="src/app/options/options.ts"></script>
 	</body>
 </html>
diff --git a/package.json b/package.json
index e85ed63db..bb9de403d 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
 	"displayName": "7TV",
 	"description": "Improve your viewing experience on Twitch & YouTube with new features, emotes, vanity and performance.",
 	"private": true,
-	"version": "3.0.7",
+	"version": "3.0.8",
 	"dev_version": "3.0",
 	"scripts": {
 		"start": "NODE_ENV=dev yarn build:dev && NODE_ENV=dev vite --mode dev",
@@ -36,11 +36,11 @@
 		"@floating-ui/dom": "^1.2.8",
 		"@intlify/unplugin-vue-i18n": "^0.10.0",
 		"@trivago/prettier-plugin-sort-imports": "^4.1.1",
-		"@types/chrome": "^0.0.235",
+		"@types/chrome": "^0.0.236",
 		"@types/dompurify": "^3.0.2",
 		"@types/fs-extra": "^11.0.1",
-		"@types/marked": "^4.3.0",
-		"@types/node": "^20.1.4",
+		"@types/marked": "^5.0.0",
+		"@types/node": "^20.2.1",
 		"@types/sharedworker": "^0.0.96",
 		"@types/ua-parser-js": "^0.7.36",
 		"@types/uuid": "^9.0.1",
@@ -65,7 +65,7 @@
 		"marked": "^5.0.2",
 		"nanoid": "^4.0.2",
 		"npm-run-all": "^4.1.5",
-		"pinia": "^2.0.36",
+		"pinia": "^2.1.3",
 		"postcss-html": "^1.5.0",
 		"postcss-scss": "^4.0.6",
 		"prettier": "^2.8.8",
diff --git a/src/site/twitch.tv/modules/chat/components/user/Badge.vue b/src/app/chat/Badge.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/user/Badge.vue
rename to src/app/chat/Badge.vue
diff --git a/src/site/twitch.tv/modules/chat/components/user/BadgeTooltip.vue b/src/app/chat/BadgeTooltip.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/user/BadgeTooltip.vue
rename to src/app/chat/BadgeTooltip.vue
diff --git a/src/app/chat/Chat.vue b/src/app/chat/Chat.vue
new file mode 100644
index 000000000..e2a3d0ee6
--- /dev/null
+++ b/src/app/chat/Chat.vue
@@ -0,0 +1,7 @@
+<template>
+	<div />
+</template>
+
+<script setup lang="ts">
+void 0;
+</script>
diff --git a/src/site/twitch.tv/modules/chat/components/message/Emote.vue b/src/app/chat/Emote.vue
similarity index 97%
rename from src/site/twitch.tv/modules/chat/components/message/Emote.vue
rename to src/app/chat/Emote.vue
index 4aa130509..b48d49abd 100644
--- a/src/site/twitch.tv/modules/chat/components/message/Emote.vue
+++ b/src/app/chat/Emote.vue
@@ -58,8 +58,8 @@ import { imageHostToSrcset } from "@/common/Image";
 import { useConfig } from "@/composable/useSettings";
 import { useTooltip } from "@/composable/useTooltip";
 import EmoteCard from "@/site/global/components/EmoteCard.vue";
-import EmoteTooltip from "@/site/twitch.tv/modules/chat/components/message/EmoteTooltip.vue";
 import SingleEmoji from "@/assets/svg/emoji/SingleEmoji.vue";
+import EmoteTooltip from "./EmoteTooltip.vue";
 import UiFloating from "@/ui/UiFloating.vue";
 import { autoPlacement, shift } from "@floating-ui/dom";
 
diff --git a/src/site/twitch.tv/modules/chat/components/message/EmoteTooltip.vue b/src/app/chat/EmoteTooltip.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/message/EmoteTooltip.vue
rename to src/app/chat/EmoteTooltip.vue
diff --git a/src/site/twitch.tv/modules/chat/components/message/parts/Link.vue b/src/app/chat/MessageTokenLink.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/message/parts/Link.vue
rename to src/app/chat/MessageTokenLink.vue
diff --git a/src/site/twitch.tv/modules/chat/components/message/parts/Mention.vue b/src/app/chat/MessageTokenMention.vue
similarity index 92%
rename from src/site/twitch.tv/modules/chat/components/message/parts/Mention.vue
rename to src/app/chat/MessageTokenMention.vue
index 6d7c49ccd..c9305f776 100644
--- a/src/site/twitch.tv/modules/chat/components/message/parts/Mention.vue
+++ b/src/app/chat/MessageTokenMention.vue
@@ -23,7 +23,7 @@
 <script setup lang="ts">
 import type { ChatMessage, MentionToken } from "@/common/chat/ChatMessage";
 import { useConfig } from "@/composable/useSettings";
-import UserTag from "@/site/twitch.tv/modules/chat/components/user/UserTag.vue";
+import UserTag from "./UserTag.vue";
 import { v4 as uuid } from "uuid";
 
 const props = defineProps<{
diff --git a/src/site/twitch.tv/modules/chat/components/message/RichEmbed.vue b/src/app/chat/RichEmbed.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/message/RichEmbed.vue
rename to src/app/chat/RichEmbed.vue
diff --git a/src/site/twitch.tv/modules/chat/components/user/UserCard.vue b/src/app/chat/UserCard.vue
similarity index 99%
rename from src/site/twitch.tv/modules/chat/components/user/UserCard.vue
rename to src/app/chat/UserCard.vue
index 268528531..dbe3c9ba9 100644
--- a/src/site/twitch.tv/modules/chat/components/user/UserCard.vue
+++ b/src/app/chat/UserCard.vue
@@ -134,8 +134,8 @@ import UserCardMod from "./UserCardMod.vue";
 import UserCardTabs from "./UserCardTabs.vue";
 import type { UserCardTabName } from "./UserCardTabs.vue";
 import UserTag from "./UserTag.vue";
+import BasicSystemMessage from "./msg/BasicSystemMessage.vue";
 import UiScrollable from "@/ui/UiScrollable.vue";
-import BasicSystemMessage from "../types/BasicSystemMessage.vue";
 import formatDate from "date-fns/fp/format";
 
 const props = defineProps<{
diff --git a/src/site/twitch.tv/modules/chat/components/user/UserCardActions.vue b/src/app/chat/UserCardActions.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/user/UserCardActions.vue
rename to src/app/chat/UserCardActions.vue
diff --git a/src/site/twitch.tv/modules/chat/components/user/UserCardMessageList.vue b/src/app/chat/UserCardMessageList.vue
similarity index 97%
rename from src/site/twitch.tv/modules/chat/components/user/UserCardMessageList.vue
rename to src/app/chat/UserCardMessageList.vue
index c04dcdc19..933e76daf 100644
--- a/src/site/twitch.tv/modules/chat/components/user/UserCardMessageList.vue
+++ b/src/app/chat/UserCardMessageList.vue
@@ -69,9 +69,9 @@ import { useApollo } from "@/composable/useApollo";
 import { TwTypeModComment } from "@/assets/gql/tw.gql";
 import { twitchUserCardCreateModCommentMut } from "@/assets/gql/tw.user-card.gql";
 import type { UserCardTabName } from "./UserCardTabs.vue";
+import UserMessage from "./UserMessage.vue";
+import NormalMessage from "./msg/0.NormalMessage.vue";
 import UiScrollable from "@/ui/UiScrollable.vue";
-import UserMessage from "../message/UserMessage.vue";
-import NormalMessage from "../types/0.NormalMessage.vue";
 
 const props = defineProps<{
 	activeTab: UserCardTabName;
diff --git a/src/site/twitch.tv/modules/chat/components/user/UserCardMod.vue b/src/app/chat/UserCardMod.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/user/UserCardMod.vue
rename to src/app/chat/UserCardMod.vue
diff --git a/src/site/twitch.tv/modules/chat/components/user/UserCardTabs.vue b/src/app/chat/UserCardTabs.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/user/UserCardTabs.vue
rename to src/app/chat/UserCardTabs.vue
diff --git a/src/site/twitch.tv/modules/chat/components/message/UserMessage.vue b/src/app/chat/UserMessage.vue
similarity index 96%
rename from src/site/twitch.tv/modules/chat/components/message/UserMessage.vue
rename to src/app/chat/UserMessage.vue
index d97b2a1f1..929e68269 100644
--- a/src/site/twitch.tv/modules/chat/components/message/UserMessage.vue
+++ b/src/app/chat/UserMessage.vue
@@ -100,13 +100,12 @@ import { useChatTools } from "@/composable/chat/useChatTools";
 import { useCosmetics } from "@/composable/useCosmetics";
 import { useConfig } from "@/composable/useSettings";
 import type { TimestampFormatKey } from "@/site/twitch.tv/modules/chat/ChatModule.vue";
-import Emote from "@/site/twitch.tv/modules/chat/components/message/Emote.vue";
-import UserTag from "@/site/twitch.tv/modules/chat/components/user/UserTag.vue";
+import Emote from "./Emote.vue";
+import MessageTokenLink from "./MessageTokenLink.vue";
+import MessageTokenMention from "./MessageTokenMention.vue";
 import RichEmbed from "./RichEmbed.vue";
 import UserMessageButtons from "./UserMessageButtons.vue";
-import Link from "./parts/Link.vue";
-import Mention from "./parts/Mention.vue";
-import ModIcons from "../mod/ModIcons.vue";
+import UserTag from "./UserTag.vue";
 import intlFormat from "date-fns/fp/intlFormat";
 
 const props = withDefaults(
@@ -220,9 +219,9 @@ if (props.msg.historical) {
 
 function getToken(token: AnyToken): AnyInstanceType {
 	if (IsMentionToken(token)) {
-		return Mention;
+		return MessageTokenMention;
 	} else if (IsLinkToken(token)) {
-		return Link;
+		return MessageTokenLink;
 	}
 }
 
diff --git a/src/site/twitch.tv/modules/chat/components/message/UserMessageButtons.vue b/src/app/chat/UserMessageButtons.vue
similarity index 96%
rename from src/site/twitch.tv/modules/chat/components/message/UserMessageButtons.vue
rename to src/app/chat/UserMessageButtons.vue
index d27ea24c1..34d308c00 100644
--- a/src/site/twitch.tv/modules/chat/components/message/UserMessageButtons.vue
+++ b/src/app/chat/UserMessageButtons.vue
@@ -55,14 +55,14 @@ import { useTimeoutFn } from "@vueuse/shared";
 import type { ChatMessage } from "@/common/chat/ChatMessage";
 import { useFloatScreen } from "@/composable/useFloatContext";
 import { useConfig } from "@/composable/useSettings";
-import UserTag from "@/site/twitch.tv/modules/chat/components/user/UserTag.vue";
+import { useTray } from "@/site/twitch.tv/modules/chat/components/tray/ChatTray";
 import CopyIcon from "@/assets/svg/icons/CopyIcon.vue";
 import PinIcon from "@/assets/svg/icons/PinIcon.vue";
 import ReplyIcon from "@/assets/svg/icons/ReplyIcon.vue";
 import TwChatReply from "@/assets/svg/twitch/TwChatReply.vue";
+import UserTag from "@/app/chat/UserTag.vue";
 import UiConfirmPrompt from "@/ui/UiConfirmPrompt.vue";
 import UiCopiedMessageToast from "@/ui/UiCopiedMessageToast.vue";
-import { useTray } from "../tray/ChatTray";
 import { shift } from "@floating-ui/dom";
 
 const props = defineProps<{
diff --git a/src/site/twitch.tv/modules/chat/components/user/UserTag.vue b/src/app/chat/UserTag.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/user/UserTag.vue
rename to src/app/chat/UserTag.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/0.NormalMessage.vue b/src/app/chat/msg/0.NormalMessage.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/0.NormalMessage.vue
rename to src/app/chat/msg/0.NormalMessage.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/11.Connected.vue b/src/app/chat/msg/11.Connected.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/11.Connected.vue
rename to src/app/chat/msg/11.Connected.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/14.SubscriptionMessage.vue b/src/app/chat/msg/14.SubscriptionMessage.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/14.SubscriptionMessage.vue
rename to src/app/chat/msg/14.SubscriptionMessage.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/15.Resubscription.vue b/src/app/chat/msg/15.Resubscription.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/15.Resubscription.vue
rename to src/app/chat/msg/15.Resubscription.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/21.SubGift.vue b/src/app/chat/msg/21.SubGift.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/21.SubGift.vue
rename to src/app/chat/msg/21.SubGift.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/26.Raid.vue b/src/app/chat/msg/26.Raid.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/26.Raid.vue
rename to src/app/chat/msg/26.Raid.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/35.SubMysteryGift.vue b/src/app/chat/msg/35.SubMysteryGift.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/35.SubMysteryGift.vue
rename to src/app/chat/msg/35.SubMysteryGift.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/43.PointsReward.vue b/src/app/chat/msg/43.PointsReward.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/43.PointsReward.vue
rename to src/app/chat/msg/43.PointsReward.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/49.AnnouncementMessage.vue b/src/app/chat/msg/49.AnnouncementMessage.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/49.AnnouncementMessage.vue
rename to src/app/chat/msg/49.AnnouncementMessage.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/BasicSystemMessage.vue b/src/app/chat/msg/BasicSystemMessage.vue
similarity index 100%
rename from src/site/twitch.tv/modules/chat/components/types/BasicSystemMessage.vue
rename to src/app/chat/msg/BasicSystemMessage.vue
diff --git a/src/site/twitch.tv/modules/chat/components/types/EmoteSetUpdateMessage.vue b/src/app/chat/msg/EmoteSetUpdateMessage.vue
similarity index 92%
rename from src/site/twitch.tv/modules/chat/components/types/EmoteSetUpdateMessage.vue
rename to src/app/chat/msg/EmoteSetUpdateMessage.vue
index 962391584..5c64ba088 100644
--- a/src/site/twitch.tv/modules/chat/components/types/EmoteSetUpdateMessage.vue
+++ b/src/app/chat/msg/EmoteSetUpdateMessage.vue
@@ -77,8 +77,8 @@ import type { ChatUser } from "@/common/chat/ChatMessage";
 import { useChannelContext } from "@/composable/channel/useChannelContext";
 import { useChatMessages } from "@/composable/chat/useChatMessages";
 import Logo from "@/assets/svg/logos/Logo.vue";
-import Emote from "../message/Emote.vue";
-import UserTag from "../user/UserTag.vue";
+import Emote from "../Emote.vue";
+import UserTag from "../UserTag.vue";
 
 const props = defineProps<{
 	appUser: SevenTV.User;
@@ -106,26 +106,28 @@ const user =
 .seventv-emote-set-update-message-container {
 	display: inline-block;
 	font-size: 1.25rem;
-	padding: 0.25em 0.5rem;
+	padding: 0.5em 0.5rem;
 	width: 100%;
 	background-color: rgba(41, 181, 246, 5%);
-	border-right: 0.1rem solid var(--seventv-primary);
-	border-left: 0.1rem solid var(--seventv-primary);
-	outline: 0.1rem solid var(--seventv-primary);
+	border-right: 0.5rem solid var(--seventv-primary);
+	border-left: 0.5rem solid var(--seventv-primary);
 
 	.seventv-logo {
 		vertical-align: middle;
-		font-size: 2.5rem;
+		font-size: 3rem;
 		color: var(--seventv-primary);
 		margin-right: 0.25em;
 	}
 
 	.seventv-author {
 		font-weight: 700;
+		font-size: 1.5rem;
 		margin-right: 0.25em;
 	}
 
 	.seventv-change-detail {
+		font-size: 1.5rem;
+
 		.referenced-emote {
 			display: inline-grid;
 			gap: 0.5em;
diff --git a/src/options/Options.vue b/src/app/options/Options.vue
similarity index 100%
rename from src/options/Options.vue
rename to src/app/options/Options.vue
diff --git a/src/options/keys.ts b/src/app/options/keys.ts
similarity index 100%
rename from src/options/keys.ts
rename to src/app/options/keys.ts
diff --git a/src/options/options.ts b/src/app/options/options.ts
similarity index 84%
rename from src/options/options.ts
rename to src/app/options/options.ts
index 85fe66790..c5555aee5 100644
--- a/src/options/options.ts
+++ b/src/app/options/options.ts
@@ -1,11 +1,11 @@
 import { createApp } from "vue";
 import { createHead } from "@vueuse/head";
 import { SITE_ASSETS_URL } from "@/common/Constant";
+import Options from "@/app/options/Options.vue";
+import { router } from "@/app/options/router/router";
 import { TooltipDirective } from "@/directive/TooltipDirective";
 import "@/i18n";
 import { setupI18n } from "@/i18n";
-import Options from "@/options/Options.vue";
-import { router } from "@/options/router/router";
 
 const app = createApp(Options);
 const head = createHead({
diff --git a/src/options/router/router.ts b/src/app/options/router/router.ts
similarity index 100%
rename from src/options/router/router.ts
rename to src/app/options/router/router.ts
diff --git a/src/options/views/Compat/Compat.vue b/src/app/options/views/Compat/Compat.vue
similarity index 99%
rename from src/options/views/Compat/Compat.vue
rename to src/app/options/views/Compat/Compat.vue
index 8c80308b4..6e6023723 100644
--- a/src/options/views/Compat/Compat.vue
+++ b/src/app/options/views/Compat/Compat.vue
@@ -56,7 +56,7 @@
 
 <script setup lang="ts">
 import { inject, reactive, ref, watch } from "vue";
-import { OPTIONS_CONTEXT_KEY } from "@/options/keys";
+import { OPTIONS_CONTEXT_KEY } from "@/app/options/keys";
 import UiButton from "@/ui/UiButton.vue";
 import UiScrollable from "@/ui/UiScrollable.vue";
 
diff --git a/src/options/views/Onboarding/Onboarding.ts b/src/app/options/views/Onboarding/Onboarding.ts
similarity index 100%
rename from src/options/views/Onboarding/Onboarding.ts
rename to src/app/options/views/Onboarding/Onboarding.ts
diff --git a/src/options/views/Onboarding/Onboarding.vue b/src/app/options/views/Onboarding/Onboarding.vue
similarity index 100%
rename from src/options/views/Onboarding/Onboarding.vue
rename to src/app/options/views/Onboarding/Onboarding.vue
diff --git a/src/options/views/Onboarding/OnboardingChangelog.vue b/src/app/options/views/Onboarding/OnboardingChangelog.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingChangelog.vue
rename to src/app/options/views/Onboarding/OnboardingChangelog.vue
diff --git a/src/options/views/Onboarding/OnboardingCompat.vue b/src/app/options/views/Onboarding/OnboardingCompat.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingCompat.vue
rename to src/app/options/views/Onboarding/OnboardingCompat.vue
diff --git a/src/options/views/Onboarding/OnboardingConfig.vue b/src/app/options/views/Onboarding/OnboardingConfig.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingConfig.vue
rename to src/app/options/views/Onboarding/OnboardingConfig.vue
diff --git a/src/options/views/Onboarding/OnboardingEnd.vue b/src/app/options/views/Onboarding/OnboardingEnd.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingEnd.vue
rename to src/app/options/views/Onboarding/OnboardingEnd.vue
diff --git a/src/options/views/Onboarding/OnboardingPlatforms.vue b/src/app/options/views/Onboarding/OnboardingPlatforms.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingPlatforms.vue
rename to src/app/options/views/Onboarding/OnboardingPlatforms.vue
diff --git a/src/options/views/Onboarding/OnboardingPromo.vue b/src/app/options/views/Onboarding/OnboardingPromo.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingPromo.vue
rename to src/app/options/views/Onboarding/OnboardingPromo.vue
diff --git a/src/options/views/Onboarding/OnboardingStart.vue b/src/app/options/views/Onboarding/OnboardingStart.vue
similarity index 100%
rename from src/options/views/Onboarding/OnboardingStart.vue
rename to src/app/options/views/Onboarding/OnboardingStart.vue
diff --git a/src/options/views/Popup/Popup.vue b/src/app/options/views/Popup/Popup.vue
similarity index 100%
rename from src/options/views/Popup/Popup.vue
rename to src/app/options/views/Popup/Popup.vue
diff --git a/src/options/views/Popup/PopupInner.vue b/src/app/options/views/Popup/PopupInner.vue
similarity index 100%
rename from src/options/views/Popup/PopupInner.vue
rename to src/app/options/views/Popup/PopupInner.vue
diff --git a/src/composable/channel/useChannelContext.ts b/src/composable/channel/useChannelContext.ts
index 80c6f306e..41c633de0 100644
--- a/src/composable/channel/useChannelContext.ts
+++ b/src/composable/channel/useChannelContext.ts
@@ -1,4 +1,4 @@
-import { inject, provide, reactive, toRaw } from "vue";
+import { inject, onMounted, onUnmounted, provide, reactive, toRaw } from "vue";
 import { useStore } from "@/store/main";
 import { log } from "@/common/Logger";
 import { WorkletEvent, useWorker } from "../useWorker";
@@ -9,22 +9,39 @@ const { sendMessage, target } = useWorker();
 
 export type ChannelRole = "BROADCASTER" | "EDITOR" | "MODERATOR" | "VIP" | "SUBSCRIBER" | "FOLLOWER";
 
-export class ChannelContext {
+export class ChannelContext implements CurrentChannel {
 	platform: Platform = "UNKNOWN";
 	id = "";
 	username = "";
 	displayName = "";
-	user: SevenTV.User | null = null;
+	user?: SevenTV.User;
 	loaded = false;
+	active = false;
+	count = 0;
 
 	actor = {
 		roles: new Set<ChannelRole>(),
 	};
 
+	get base(): CurrentChannel {
+		return {
+			id: this.id,
+			username: this.username,
+			displayName: this.displayName,
+			active: this.active,
+		};
+	}
+
 	setCurrentChannel(channel: CurrentChannel): boolean {
+		// Notify the worker about this new channel we are on
+		sendMessage("STATE", {
+			channel: toRaw(this.base),
+		});
+
 		if (this.id === channel.id) {
 			this.username = channel.username;
 			this.displayName = channel.displayName;
+			this.active = channel.active;
 
 			return false;
 		}
@@ -34,6 +51,7 @@ export class ChannelContext {
 		this.id = channel.id;
 		this.username = channel.username;
 		this.displayName = channel.displayName;
+		this.active = channel.active;
 
 		m.set(channel.id, this);
 		m.delete(oldID);
@@ -42,37 +60,40 @@ export class ChannelContext {
 		return true;
 	}
 
+	leave(): void {
+		this.active = false;
+
+		sendMessage("STATE", {
+			channel: toRaw(this.base),
+		});
+	}
+
 	fetch(): void {
 		// Listen for worker confirmation of channel fetch
 		const onLoaded = (ev: WorkletEvent<"channel_fetched">) => {
 			if (this.id !== ev.detail.id) return;
 
 			this.loaded = true;
-			this.user = ev.detail.user ?? null;
+			this.user = ev.detail.user;
 
 			log.info("Channel loaded:", this.id);
 			target.removeEventListener("channel_fetched", onLoaded);
 		};
 		target.addEventListener("channel_fetched", onLoaded);
-
-		// Notify the worker about this new channel we are on
-		sendMessage("STATE", {
-			channel: toRaw({
-				id: this.id,
-				username: this.username,
-				displayName: this.displayName,
-			}),
-		});
 	}
 }
 
 const m = new Map<string, ChannelContext>();
 
-export function useChannelContext(channelID?: string): ChannelContext {
+/**
+ * @param channelID the ID of the current channel to use for the context
+ * @param track if true, the mount state of the component will control the channel's activeness
+ */
+export function useChannelContext(channelID?: string, track = false): ChannelContext {
 	let ctx = inject<ChannelContext | null>(CHANNEL_CTX, null);
 	if (!ctx) {
 		ctx = (channelID ? m.get(channelID) : null) ?? reactive<ChannelContext>(new ChannelContext());
-		if (channelID) ctx.setCurrentChannel({ id: channelID ?? "", username: "", displayName: "" });
+		if (channelID) ctx.setCurrentChannel({ id: channelID ?? "", username: "", displayName: "", active: true });
 
 		const store = useStore();
 		ctx.platform = store.platform;
@@ -81,5 +102,22 @@ export function useChannelContext(channelID?: string): ChannelContext {
 		if (channelID) m.set(channelID, ctx);
 	}
 
+	if (track) {
+		onMounted(() => {
+			if (!ctx) return;
+
+			ctx.count++;
+		});
+
+		onUnmounted(() => {
+			if (!ctx || !ctx.count) return;
+
+			ctx.count--;
+			if (ctx.count > 0) return;
+
+			ctx.leave();
+		});
+	}
+
 	return ctx;
 }
diff --git a/src/composable/useWorker.ts b/src/composable/useWorker.ts
index 07d22799c..fc9b586bd 100644
--- a/src/composable/useWorker.ts
+++ b/src/composable/useWorker.ts
@@ -10,7 +10,7 @@ let worker: SharedWorker | null = null;
 
 type WorkerAddrMap = Record<string, string>;
 
-async function init(bc: BroadcastChannel, originURL: string): Promise<SharedWorker> {
+async function init(originURL: string): Promise<SharedWorker> {
 	let sw: SharedWorker;
 
 	// Check for existing url
@@ -67,15 +67,14 @@ async function init(bc: BroadcastChannel, originURL: string): Promise<SharedWork
 	return new Promise<SharedWorker>((resolve, reject) => {
 		if (!workerURL) return reject("No address to worker");
 
-		// Define message handlers
-		useGlobalHandlers(bc);
-
 		// Spawn or connect to worker
 		sw = worker = new SharedWorker(workerURL, {
 			name: "seventv-extension",
 		});
 		sw.port.start();
 
+		// Define message handlers
+		useGlobalHandlers(sw.port);
 		useHandlers(sw.port);
 
 		// Emit close on page exit
@@ -104,8 +103,8 @@ export function useWorker() {
 	};
 }
 
-function useGlobalHandlers(bc: BroadcastChannel) {
-	bc.onmessage = (ev) => {
+function useGlobalHandlers(chan: MessagePort) {
+	chan.addEventListener("message", (ev) => {
 		const { type, data } = ev.data;
 
 		switch (type) {
@@ -118,7 +117,7 @@ function useGlobalHandlers(bc: BroadcastChannel) {
 				break;
 			}
 		}
-	};
+	});
 }
 
 function useHandlers(mp: MessagePort) {
diff --git a/src/db/idb.ts b/src/db/idb.ts
index 80ffd8261..bb50e9f58 100644
--- a/src/db/idb.ts
+++ b/src/db/idb.ts
@@ -93,7 +93,7 @@ export class Dexie7 extends Dexie {
 		});
 	}
 
-	async expireDocuments(exemptChannels?: string[]): Promise<void> {
+	async expireDocuments(exemptChannels: string[] = []): Promise<void> {
 		const now = Date.now();
 		const oneHour = 1000 * 60 * 60;
 
@@ -119,13 +119,23 @@ export class Dexie7 extends Dexie {
 				.delete();
 
 			// Clean up entitlements
-			this.entitlements.filter((e) => !exemptChannels?.includes(e.scope?.split(":")[1] ?? "")).delete();
+			this.entitlements
+				.filter(
+					(e) => !e.scope || e.scope.split(",").every((v) => !exemptChannels.includes(v.split(":")[1] ?? "")),
+				)
+				.delete();
 
 			// Delete channels
 			this.channels
 				.where("id")
 				.anyOf(channels.map((c) => c.id))
 				.delete();
+
+			// Clean up cosmetics
+			this.cosmetics
+				.where("timestamp")
+				.below(now - oneHour * 24)
+				.delete();
 		}
 	}
 }
diff --git a/src/site/App.vue b/src/site/App.vue
index d5455b90b..0ea2b0d99 100644
--- a/src/site/App.vue
+++ b/src/site/App.vue
@@ -26,10 +26,10 @@ import { useFrankerFaceZ } from "@/composable/useFrankerFaceZ";
 import { fillSettings, useConfig, useSettings } from "@/composable/useSettings";
 import { useWorker } from "@/composable/useWorker";
 import Global from "./global/Global.vue";
-import KickSite from "./kick.com/KickSite.vue";
 
 const TwitchSite = defineAsyncComponent(() => import("@/site/twitch.tv/TwitchSite.vue"));
 const YouTubeSite = defineAsyncComponent(() => import("@/site/youtube.com/YouTubeSite.vue"));
+const KickSite = defineAsyncComponent(() => import("@/site/kick.com/KickSite.vue"));
 
 if (import.meta.hot) {
 	import.meta.hot.on("full-reload", () => {
@@ -64,9 +64,8 @@ db.ready().then(async () => {
 });
 
 // Spawn SharedWorker
-const netChannel = new BroadcastChannel("SEVENTV#NETWORK");
 const { init, target } = useWorker();
-init(netChannel, inject(SITE_WORKER_URL, ""));
+init(inject(SITE_WORKER_URL, ""));
 
 target.addEventListener("ready", () => {
 	log.info("Worker ready");
diff --git a/src/site/kick.com/KickSite.vue b/src/site/kick.com/KickSite.vue
index 3518ca7e2..2065bc11a 100644
--- a/src/site/kick.com/KickSite.vue
+++ b/src/site/kick.com/KickSite.vue
@@ -5,13 +5,14 @@
 </template>
 
 <script setup lang="ts">
-import { provide } from "vue";
+import { defineAsyncComponent, provide } from "vue";
 import { useStore } from "@/store/main";
 import { SITE_CURRENT_PLATFORM } from "@/common/Constant";
 import { getModule } from "@/composable/useModule";
 import { useUserAgent } from "@/composable/useUserAgent";
 import { KickModuleID } from "@/types/kick.module";
-import ModuleWrapper from "../global/ModuleWrapper.vue";
+
+const ModuleWrapper = defineAsyncComponent(() => import("@/site/global/ModuleWrapper.vue"));
 
 const store = useStore();
 const ua = useUserAgent();
diff --git a/src/site/kick.com/modules/chat/ChatController.vue b/src/site/kick.com/modules/chat/ChatController.vue
index f09e38f96..7a5c1cfa1 100644
--- a/src/site/kick.com/modules/chat/ChatController.vue
+++ b/src/site/kick.com/modules/chat/ChatController.vue
@@ -22,7 +22,7 @@ const { id: channelID, username: channelUsername } = toRefs(
 	inject(KICK_CHANNEL_KEY, { id: "", username: "", currentMessage: "" }),
 );
 
-const ctx = useChannelContext(channelID.value);
+const ctx = useChannelContext(channelID.value, true);
 
 // The list
 const chatList = ref<HTMLDivElement | null>(null);
@@ -34,6 +34,7 @@ watchEffect(async () => {
 		id: channelID.value,
 		username: channelUsername.value,
 		displayName: channelUsername.value,
+		active: true,
 	});
 	if (ok) {
 		chatList.value = null;
diff --git a/src/site/kick.com/modules/chat/ChatMessage.vue b/src/site/kick.com/modules/chat/ChatMessage.vue
index 37a8ec76c..a84dc6ba5 100644
--- a/src/site/kick.com/modules/chat/ChatMessage.vue
+++ b/src/site/kick.com/modules/chat/ChatMessage.vue
@@ -20,7 +20,7 @@ import { AnyToken } from "@/common/chat/ChatMessage";
 import { IsEmoteToken } from "@/common/type-predicates/MessageTokens";
 import { useChannelContext } from "@/composable/channel/useChannelContext";
 import { useChatEmotes } from "@/composable/chat/useChatEmotes";
-import Emote from "@/site/twitch.tv/modules/chat/components/message/Emote.vue";
+import Emote from "@/app/chat/Emote.vue";
 
 type MessageTokenOrText = AnyToken | string;
 
diff --git a/src/site/twitch.tv/TwitchSite.vue b/src/site/twitch.tv/TwitchSite.vue
index 1d2961b3c..3ab87085d 100644
--- a/src/site/twitch.tv/TwitchSite.vue
+++ b/src/site/twitch.tv/TwitchSite.vue
@@ -18,7 +18,7 @@ import { synchronizeFrankerFaceZ, useConfig, useSettings } from "@/composable/us
 import { useUserAgent } from "@/composable/useUserAgent";
 import type { TwModuleID } from "@/types/tw.module";
 
-const ModuleWrapper = defineAsyncComponent(() => import("../global/ModuleWrapper.vue"));
+const ModuleWrapper = defineAsyncComponent(() => import("@/site/global/ModuleWrapper.vue"));
 
 const store = useStore();
 const ua = useUserAgent();
diff --git a/src/site/twitch.tv/modules/chat-input/ChatInput.vue b/src/site/twitch.tv/modules/chat-input/ChatInput.vue
index a4a6dd762..79cfa3c07 100644
--- a/src/site/twitch.tv/modules/chat-input/ChatInput.vue
+++ b/src/site/twitch.tv/modules/chat-input/ChatInput.vue
@@ -46,7 +46,7 @@ const props = defineProps<{
 
 const mod = getModule<"TWITCH", "chat-input">("chat-input");
 const store = useStore();
-const ctx = useChannelContext(props.instance.component.componentRef.props.channelID);
+const ctx = useChannelContext(props.instance.component.componentRef.props.channelID, true);
 const messages = useChatMessages(ctx);
 const emotes = useChatEmotes(ctx);
 const cosmetics = useCosmetics(store.identity?.id ?? "");
diff --git a/src/site/twitch.tv/modules/chat-input/ChatInputCarousel.vue b/src/site/twitch.tv/modules/chat-input/ChatInputCarousel.vue
index 6e5ff1021..fb333793f 100644
--- a/src/site/twitch.tv/modules/chat-input/ChatInputCarousel.vue
+++ b/src/site/twitch.tv/modules/chat-input/ChatInputCarousel.vue
@@ -36,8 +36,8 @@ import { HookedInstance } from "@/common/ReactHooks";
 import { useConfig } from "@/composable/useSettings";
 import CaretIcon from "@/assets/svg/icons/CaretIcon.vue";
 import { TabToken } from "./ChatInput.vue";
+import Emote from "@/app/chat/Emote.vue";
 import UiFloating from "@/ui/UiFloating.vue";
-import Emote from "../chat/components/message/Emote.vue";
 
 const props = defineProps<{
 	instance: HookedInstance<Twitch.ChatAutocompleteComponent>;
diff --git a/src/site/twitch.tv/modules/chat-vod/ChatVod.vue b/src/site/twitch.tv/modules/chat-vod/ChatVod.vue
index ba6e21e65..92384b1ae 100644
--- a/src/site/twitch.tv/modules/chat-vod/ChatVod.vue
+++ b/src/site/twitch.tv/modules/chat-vod/ChatVod.vue
@@ -24,8 +24,8 @@ import { useChannelContext } from "@/composable/channel/useChannelContext";
 import { useChatEmotes } from "@/composable/chat/useChatEmotes";
 import { useChatProperties } from "@/composable/chat/useChatProperties";
 import ChatData from "@/site/twitch.tv/modules/chat/ChatData.vue";
-import UserMessage from "@/site/twitch.tv/modules/chat/components/message/UserMessage.vue";
 import type { TwTypeUser } from "@/assets/gql/tw.gql";
+import UserMessage from "@/app/chat/UserMessage.vue";
 import { MessagePartType } from "../..";
 import intervalToDuration from "date-fns/fp/intervalToDuration";
 
@@ -58,7 +58,7 @@ const props = defineProps<{
 
 // Set up context
 // No ID initialization to avoid conflict with live channel
-const ctx = useChannelContext();
+const ctx = useChannelContext(undefined, true);
 const emotes = useChatEmotes(ctx);
 const properties = useChatProperties(ctx);
 
@@ -77,6 +77,7 @@ definePropertyHook(props.controller.component, "props", {
 				id: owner.id,
 				username: owner.login,
 				displayName: owner.login,
+				active: true,
 			});
 
 			channelBadges = owner.broadcastBadges;
diff --git a/src/site/twitch.tv/modules/chat/ChatController.vue b/src/site/twitch.tv/modules/chat/ChatController.vue
index 42c298e47..80a2f1cd1 100644
--- a/src/site/twitch.tv/modules/chat/ChatController.vue
+++ b/src/site/twitch.tv/modules/chat/ChatController.vue
@@ -56,13 +56,13 @@ import ChatList from "@/site/twitch.tv/modules/chat/ChatList.vue";
 import PauseIcon from "@/assets/svg/icons/PauseIcon.vue";
 import ChatPubSub from "./ChatPubSub.vue";
 import ChatTray from "./components/tray/ChatTray.vue";
-import BasicSystemMessage from "./components/types/BasicSystemMessage.vue";
+import BasicSystemMessage from "@/app/chat/msg/BasicSystemMessage.vue";
 import UiScrollable from "@/ui/UiScrollable.vue";
 
 const props = defineProps<{
-	list: HookedInstance<Twitch.ChatListComponent>;
 	controller: HookedInstance<Twitch.ChatControllerComponent>;
 	room: HookedInstance<Twitch.ChatRoomComponent>;
+	list: HookedInstance<Twitch.ChatListComponent>;
 	buffer?: HookedInstance<Twitch.MessageBufferComponent>;
 	events?: HookedInstance<Twitch.ChatEventComponent>;
 }>();
@@ -84,7 +84,7 @@ const scrollerRef = ref<InstanceType<typeof UiScrollable> | undefined>();
 
 const primaryColor = ref("");
 
-const ctx = useChannelContext(props.controller.component.props.channelID);
+const ctx = useChannelContext(props.controller.component.props.channelID, true);
 const worker = useWorker();
 const emotes = useChatEmotes(ctx);
 const messages = useChatMessages(ctx);
@@ -116,18 +116,32 @@ watchEffect(() => {
 });
 
 const messageHandler = ref<Twitch.MessageHandlerAPI | null>(null);
-definePropertyHook(props.list.component, "props", {
-	value(v) {
-		messageHandler.value = v.messageHandlerAPI;
 
-		// Find message to grab some data
-		// eslint-disable-next-line @typescript-eslint/no-explicit-any
-		const msgItem = (v.children[0] as any | undefined)?.props as Twitch.ChatLineComponent["props"];
-		if (!msgItem?.badgeSets?.count) return;
+watch(
+	list,
+	(inst, old) => {
+		if (!inst || !inst.component) return;
+
+		if (old && old.component && inst !== old) {
+			unsetPropertyHook(old.component, "props");
+			return;
+		}
+
+		definePropertyHook(inst.component, "props", {
+			value(v) {
+				messageHandler.value = v.messageHandlerAPI;
 
-		properties.twitchBadgeSets = msgItem.badgeSets;
+				// Find message to grab some data
+				// eslint-disable-next-line @typescript-eslint/no-explicit-any
+				const msgItem = (v.children[0] as any | undefined)?.props as Twitch.ChatLineComponent["props"];
+				if (!msgItem?.badgeSets?.count) return;
+
+				properties.twitchBadgeSets = msgItem.badgeSets;
+			},
+		});
 	},
-});
+	{ immediate: true },
+);
 
 // Retrieve and convert Twitch Emotes
 //
@@ -147,32 +161,44 @@ watch(twitchEmoteSetsDbc, async (sets) => {
 });
 
 // Keep track of user chat config
-definePropertyHook(room.value.component, "props", {
-	value(v) {
-		properties.primaryColorHex = v.primaryColorHex;
-		primaryColor.value = `#${v.primaryColorHex ?? "755ebc"}`;
-		document.body.style.setProperty("--seventv-channel-accent", primaryColor.value);
-
-		properties.useHighContrastColors = v.useHighContrastColors;
-		properties.showTimestamps = v.showTimestamps;
-		properties.showModerationIcons = v.showModerationIcons;
-
-		properties.pauseReason.clear();
-		properties.pauseReason.add("SCROLL");
-		switch (v.chatPauseSetting) {
-			case "MOUSEOVER_ALTKEY":
-				properties.pauseReason.add("ALTKEY");
-				properties.pauseReason.add("MOUSEOVER");
-				break;
-			case "MOUSEOVER":
-				properties.pauseReason.add("MOUSEOVER");
-				break;
-			case "ALTKEY":
-				properties.pauseReason.add("ALTKEY");
-				break;
+watch(
+	room,
+	(inst, old) => {
+		if (!inst || !inst.component) return;
+
+		if (old && old.component && inst !== old) {
+			unsetPropertyHook(old.component, "props");
 		}
+
+		definePropertyHook(room.value.component, "props", {
+			value(v) {
+				properties.primaryColorHex = v.primaryColorHex;
+				primaryColor.value = `#${v.primaryColorHex ?? "755ebc"}`;
+				document.body.style.setProperty("--seventv-channel-accent", primaryColor.value);
+
+				properties.useHighContrastColors = v.useHighContrastColors;
+				properties.showTimestamps = v.showTimestamps;
+				properties.showModerationIcons = v.showModerationIcons;
+
+				properties.pauseReason.clear();
+				properties.pauseReason.add("SCROLL");
+				switch (v.chatPauseSetting) {
+					case "MOUSEOVER_ALTKEY":
+						properties.pauseReason.add("ALTKEY");
+						properties.pauseReason.add("MOUSEOVER");
+						break;
+					case "MOUSEOVER":
+						properties.pauseReason.add("MOUSEOVER");
+						break;
+					case "ALTKEY":
+						properties.pauseReason.add("ALTKEY");
+						break;
+				}
+			},
+		});
 	},
-});
+	{ immediate: true },
+);
 
 // Keep track of chat state
 definePropertyHook(controller.value.component, "props", {
@@ -182,6 +208,7 @@ definePropertyHook(controller.value.component, "props", {
 				id: v.channelID,
 				username: v.channelLogin,
 				displayName: v.channelDisplayName,
+				active: true,
 			};
 		}
 
@@ -202,7 +229,7 @@ definePropertyHook(controller.value.component, "props", {
 		messages.sendMessage = v.chatConnectionAPI.sendMessage;
 		defineFunctionHook(v.chatConnectionAPI, "sendMessage", function (old, ...args) {
 			worker.sendMessage("CHANNEL_ACTIVE_CHATTER", {
-				channel_id: ctx.id,
+				channel: toRaw(ctx.base),
 			});
 
 			// Run message content patching middleware
@@ -370,10 +397,12 @@ onUnmounted(() => {
 	log.debug("<ChatController> Unmounted");
 
 	// Unset hooks
-	unsetPropertyHook(list.value.component.props, "messageHandlerAPI");
-	unsetPropertyHook(list.value.component, "props");
 	unsetPropertyHook(controller.value.component, "props");
-	unsetPropertyHook(room.value.component, "props");
+	if (list.value) {
+		unsetPropertyHook(list.value.component.props, "messageHandlerAPI");
+		unsetPropertyHook(list.value.component, "props");
+	}
+	if (room.value) unsetPropertyHook(room.value.component, "props");
 
 	document.body.style.removeProperty("--seventv-channel-accent");
 });
diff --git a/src/site/twitch.tv/modules/chat/ChatData.vue b/src/site/twitch.tv/modules/chat/ChatData.vue
index f7cfb794d..3f1946ed6 100644
--- a/src/site/twitch.tv/modules/chat/ChatData.vue
+++ b/src/site/twitch.tv/modules/chat/ChatData.vue
@@ -8,7 +8,7 @@ import { useChatEmotes } from "@/composable/chat/useChatEmotes";
 import { useChatMessages } from "@/composable/chat/useChatMessages";
 import { useLiveQuery } from "@/composable/useLiveQuery";
 import { WorkletEvent, useWorker } from "@/composable/useWorker";
-import EmoteSetUpdateMessage from "./components/types/EmoteSetUpdateMessage.vue";
+import EmoteSetUpdateMessage from "@/app/chat/msg/EmoteSetUpdateMessage.vue";
 import { v4 as uuidv4 } from "uuid";
 
 const { target } = useWorker();
diff --git a/src/site/twitch.tv/modules/chat/ChatList.vue b/src/site/twitch.tv/modules/chat/ChatList.vue
index 237f216e8..2503d02d6 100644
--- a/src/site/twitch.tv/modules/chat/ChatList.vue
+++ b/src/site/twitch.tv/modules/chat/ChatList.vue
@@ -39,9 +39,9 @@ import { useChatScroller } from "@/composable/chat/useChatScroller";
 import { useConfig } from "@/composable/useSettings";
 import { MessagePartType, MessageType, ModerationType } from "@/site/twitch.tv/";
 import ChatMessageUnhandled from "./ChatMessageUnhandled.vue";
-import UserMessage from "./components/message/UserMessage.vue";
 import ModSlider from "./components/mod/ModSlider.vue";
-import BasicSystemMessage from "./components/types/BasicSystemMessage.vue";
+import UserMessage from "@/app/chat/UserMessage.vue";
+import BasicSystemMessage from "@/app/chat/msg/BasicSystemMessage.vue";
 
 const props = defineProps<{
 	list: HookedInstance<Twitch.ChatListComponent>;
@@ -77,10 +77,10 @@ const list = toRef(props, "list");
 // Unrender messages out of view
 const chatListEl = ref<HTMLElement>();
 
-const types = import.meta.glob<object>("./components/types/*.vue", { eager: true, import: "default" });
+const types = import.meta.glob<object>("@/app/chat/msg/*.vue", { eager: true, import: "default" });
 const typeMap = {} as Record<number, ComponentFactory>;
 
-const componentRegexp = /\.\/components\/types\/(\d+)\.(\w+)\.vue$/;
+const componentRegexp = /src\/app\/chat\/msg\/(\d+)\.(\w+)\.vue$/;
 for (const [path, component] of Object.entries(types)) {
 	const [, type] = path.match(componentRegexp) ?? [];
 	if (!type) continue;
diff --git a/src/site/twitch.tv/modules/chat/components/tray/ReplyTray.vue b/src/site/twitch.tv/modules/chat/components/tray/ReplyTray.vue
index 3628af0cc..e4d0e38cc 100644
--- a/src/site/twitch.tv/modules/chat/components/tray/ReplyTray.vue
+++ b/src/site/twitch.tv/modules/chat/components/tray/ReplyTray.vue
@@ -39,12 +39,12 @@ import { ChatMessage } from "@/common/chat/ChatMessage";
 import { useChannelContext } from "@/composable/channel/useChannelContext";
 import { useChatEmotes } from "@/composable/chat/useChatEmotes";
 import { useApollo } from "@/composable/useApollo";
-import UserMessage from "@/site/twitch.tv/modules/chat/components/message/UserMessage.vue";
 import { twitchChatReplyQuery } from "@/assets/gql/tw.chat-replies.gql";
 import type { TwTypeMessage } from "@/assets/gql/tw.gql";
 import TwChatReply from "@/assets/svg/twitch/TwChatReply.vue";
 import TwClose from "@/assets/svg/twitch/TwClose.vue";
 import TwReply from "@/assets/svg/twitch/TwReply.vue";
+import UserMessage from "@/app/chat/UserMessage.vue";
 import UiScrollable from "@/ui/UiScrollable.vue";
 
 const props = defineProps<{
diff --git a/src/site/twitch.tv/modules/emote-menu/EmoteMenu.vue b/src/site/twitch.tv/modules/emote-menu/EmoteMenu.vue
index fe4daf8bb..1b3a2684c 100644
--- a/src/site/twitch.tv/modules/emote-menu/EmoteMenu.vue
+++ b/src/site/twitch.tv/modules/emote-menu/EmoteMenu.vue
@@ -90,7 +90,7 @@ const containerRef = ref<HTMLElement | undefined>();
 const ctx = useEmoteMenuContext();
 ctx.channelID = props.instance.component.props.channelID ?? "";
 
-const channelCtx = useChannelContext(ctx.channelID);
+const channelCtx = useChannelContext(ctx.channelID, true);
 const settingsContext = useSettingsMenu();
 const emotes = useChatEmotes(channelCtx);
 
diff --git a/src/site/twitch.tv/modules/emote-menu/EmoteMenuSet.vue b/src/site/twitch.tv/modules/emote-menu/EmoteMenuSet.vue
index 6b733e266..624c96b8e 100644
--- a/src/site/twitch.tv/modules/emote-menu/EmoteMenuSet.vue
+++ b/src/site/twitch.tv/modules/emote-menu/EmoteMenuSet.vue
@@ -46,11 +46,11 @@ import { useConfig } from "@/composable/useSettings";
 import DropdownIcon from "@/assets/svg/icons/DropdownIcon.vue";
 import Logo from "@/assets/svg/logos/Logo.vue";
 import { useEmoteMenuContext } from "./EmoteMenuContext";
+import Emote from "@/app/chat/Emote.vue";
 import {
 	ElementLifecycle,
 	ElementLifecycleDirective as vElementLifecycle,
 } from "@/directive/ElementLifecycleDirective";
-import Emote from "../chat/components/message/Emote.vue";
 
 const props = defineProps<{
 	es: SevenTV.EmoteSet;
diff --git a/src/site/twitch.tv/modules/mod-logs/ModLogsAuthorityMessages.vue b/src/site/twitch.tv/modules/mod-logs/ModLogsAuthorityMessages.vue
index f133b678d..19db63af3 100644
--- a/src/site/twitch.tv/modules/mod-logs/ModLogsAuthorityMessages.vue
+++ b/src/site/twitch.tv/modules/mod-logs/ModLogsAuthorityMessages.vue
@@ -10,7 +10,7 @@
 import { useChannelContext } from "@/composable/channel/useChannelContext";
 import { useChatEmotes } from "@/composable/chat/useChatEmotes";
 import { useModLogsStore } from "./ModLogsStore";
-import UserMessage from "../chat/components/message/UserMessage.vue";
+import UserMessage from "@/app/chat/UserMessage.vue";
 
 const localStore = useModLogsStore();
 const ctx = useChannelContext();
diff --git a/src/site/twitch.tv/modules/mod-logs/ModLogsRecentActionsItem.vue b/src/site/twitch.tv/modules/mod-logs/ModLogsRecentActionsItem.vue
index dd8e0c69a..882304dca 100644
--- a/src/site/twitch.tv/modules/mod-logs/ModLogsRecentActionsItem.vue
+++ b/src/site/twitch.tv/modules/mod-logs/ModLogsRecentActionsItem.vue
@@ -29,8 +29,8 @@
 import { ref } from "vue";
 import { useIntervalFn } from "@vueuse/shared";
 import type { ChatMessage, ChatMessageModeration, ChatUser } from "@/common/chat/ChatMessage";
-import UserMessage from "@/site/twitch.tv/modules/chat/components/message/UserMessage.vue";
-import UserTag from "@/site/twitch.tv/modules/chat/components/user/UserTag.vue";
+import UserMessage from "@/app/chat/UserMessage.vue";
+import UserTag from "@/app/chat/UserTag.vue";
 import formatDistance from "date-fns/formatDistance";
 
 const props = defineProps<{
diff --git a/src/site/twitch.tv/modules/sidebar-previews/SidebarCard.vue b/src/site/twitch.tv/modules/sidebar-previews/SidebarCard.vue
index 504b12724..787f3d41a 100644
--- a/src/site/twitch.tv/modules/sidebar-previews/SidebarCard.vue
+++ b/src/site/twitch.tv/modules/sidebar-previews/SidebarCard.vue
@@ -35,7 +35,7 @@ watch(
 
 			if (tooltip && typeof tooltip.type == "function") {
 				defineFunctionHook(tooltip.type.prototype, "render", function (old, ...args: unknown[]) {
-					const vnode = old?.apply(this, args);
+					const vnode = old?.apply(this, args) ?? null;
 
 					return patchTooltip(this, vnode);
 				});
@@ -70,7 +70,7 @@ function patchTooltip(tooltip: ReactExtended.ReactRuntimeElement, vnode: ReactEx
 		props: {
 			className: "seventv-sidebar-tooltip-preview",
 			style: {
-				backgroundImage: getThumbnail(tooltip.props.channelDisplayName.toLowerCase()),
+				backgroundImage: getThumbnail(tooltip.props.channelDisplayName?.toLowerCase() ?? "???"),
 			},
 		},
 	});
diff --git a/src/site/twitch.tv/modules/sidebar-previews/SidebarPreviewsModule.vue b/src/site/twitch.tv/modules/sidebar-previews/SidebarPreviewsModule.vue
index 49e9b1327..2d0b0b6cf 100644
--- a/src/site/twitch.tv/modules/sidebar-previews/SidebarPreviewsModule.vue
+++ b/src/site/twitch.tv/modules/sidebar-previews/SidebarPreviewsModule.vue
@@ -1,12 +1,12 @@
 <template>
 	<template v-for="inst in sidebarCard.instances" :key="inst.identifier">
-		<SidebarCard :instance="inst" />
+		<SidebarCard v-if="showPreviews" :instance="inst" />
 	</template>
 </template>
 
 <script setup lang="ts">
 import { declareModule } from "@/composable/useModule";
-import { declareConfig } from "@/composable/useSettings";
+import { declareConfig, useConfig } from "@/composable/useSettings";
 import { useComponentHook } from "@/common/ReactHooks";
 import SidebarCard from "./SidebarCard.vue";
 
@@ -15,6 +15,8 @@ const { markAsReady } = declareModule("sidebar-previews", {
 	depends_on: ["settings"],
 });
 
+const showPreviews = useConfig<boolean>("ui.sidebar_previews");
+
 const sidebarCard = useComponentHook<Twitch.SidebarCardComponent>({
 	parentSelector: ".side-nav-section",
 	predicate: (n) => n.props && n.props.title && n.props.isWatchParty !== null && n.props.linkTo,
diff --git a/src/site/youtube.com/YouTubeSite.vue b/src/site/youtube.com/YouTubeSite.vue
index b0b38394e..10755b46e 100644
--- a/src/site/youtube.com/YouTubeSite.vue
+++ b/src/site/youtube.com/YouTubeSite.vue
@@ -11,7 +11,7 @@ import { getModule } from "@/composable/useModule";
 import { useUserAgent } from "@/composable/useUserAgent";
 import { YtModuleID } from "@/types/yt.module";
 
-const ModuleWrapper = defineAsyncComponent(() => import("../global/ModuleWrapper.vue"));
+const ModuleWrapper = defineAsyncComponent(() => import("@/site/global/ModuleWrapper.vue"));
 
 const store = useStore();
 const ua = useUserAgent();
diff --git a/src/site/youtube.com/modules/chat/ChatController.vue b/src/site/youtube.com/modules/chat/ChatController.vue
index 860222263..46dc06bf1 100644
--- a/src/site/youtube.com/modules/chat/ChatController.vue
+++ b/src/site/youtube.com/modules/chat/ChatController.vue
@@ -18,7 +18,7 @@ const props = defineProps<{
 	chatList: YouTube.LiveChatItemListRenderer;
 }>();
 
-const ctx = useChannelContext(props.channelId);
+const ctx = useChannelContext(props.channelId, true);
 const emotes = useChatEmotes(ctx);
 
 const seenEmojis = {} as Record<string, SevenTV.ActiveEmote>;
@@ -28,6 +28,7 @@ watchEffect(() => {
 		id: props.channelId,
 		displayName: "",
 		username: "",
+		active: true,
 	});
 
 	defineFunctionHook(
diff --git a/src/types/app.d.ts b/src/types/app.d.ts
index 3547032b7..391bf2a75 100644
--- a/src/types/app.d.ts
+++ b/src/types/app.d.ts
@@ -356,6 +356,7 @@ interface CurrentChannel {
 	username: string;
 	displayName: string;
 	user?: SevenTV.User;
+	active: boolean;
 }
 
 declare namespace BTTV {
diff --git a/src/worker/event-handlers/entitlement.handler.ts b/src/worker/event-handlers/entitlement.handler.ts
index 74fca4618..c694eee5e 100644
--- a/src/worker/event-handlers/entitlement.handler.ts
+++ b/src/worker/event-handlers/entitlement.handler.ts
@@ -17,7 +17,7 @@ export async function onEntitlementCreate(ctx: EventContext, cm: ChangeMap<Seven
 		ctx.db.entitlements
 			.put({
 				...obj,
-				scope: `${platform}:${port.channel?.id ?? "X"}`,
+				scope: port.channelIds.map((channelID) => `${platform}:${channelID ?? "X"}`).join(","),
 				user_id: cid,
 			})
 			.catch(() => ctx.db.entitlements.update(obj.id, obj));
diff --git a/src/worker/index.ts b/src/worker/index.ts
index c59ae3e1a..79a29c6b4 100644
--- a/src/worker/index.ts
+++ b/src/worker/index.ts
@@ -30,7 +30,7 @@ export type WorkerMessageType = keyof typeof workerMessageType;
 
 export type TypedWorkerMessage<T extends WorkerMessageType> = {
 	CHANNEL_ACTIVE_CHATTER: {
-		channel_id: string;
+		channel: CurrentChannel;
 	};
 	CHANNEL_FETCHED: {
 		channel: CurrentChannel;
@@ -90,6 +90,7 @@ export interface EventContext {
 	driver: WorkerDriver;
 	eventAPI: EventAPI;
 	db: Dexie7;
+	channelID?: string;
 }
 
 export enum EventAPIOpCode {
diff --git a/src/worker/worker.driver.ts b/src/worker/worker.driver.ts
index cd48b2a55..d12ff5052 100644
--- a/src/worker/worker.driver.ts
+++ b/src/worker/worker.driver.ts
@@ -5,10 +5,8 @@ import { Dexie7, db } from "@/db/idb";
 import { EventAPI } from "./worker.events";
 import { WorkerHttp } from "./worker.http";
 import { WorkerPort } from "./worker.port";
-import { TypedWorkerMessage, WorkerMessageType } from ".";
 
 export class WorkerDriver extends EventTarget {
-	bc: BroadcastChannel;
 	http: WorkerHttp;
 	eventAPI: EventAPI;
 	db: Dexie7;
@@ -22,20 +20,18 @@ export class WorkerDriver extends EventTarget {
 	constructor(public w: SharedWorkerGlobalScope) {
 		super();
 
-		this.bc = new BroadcastChannel("SEVENTV#NETWORK");
 		this.db = db;
 		this.log = log;
 		this.log.setContextName("Worker");
 		this.log.pipe = (type, text, extraCSS, objects) => {
-			this.bc.postMessage({
-				type: "LOG",
-				data: {
+			for (const port of this.ports.values()) {
+				port.postMessage("LOG", {
 					type,
 					text,
 					css: extraCSS,
-					objects,
-				},
-			});
+					objects: objects ?? [],
+				});
+			}
 		};
 
 		this.http = new WorkerHttp(this);
@@ -82,8 +78,8 @@ export class WorkerDriver extends EventTarget {
 				// Do DB cleanup for unused data
 				setTimeout(() => {
 					const exemptions = Array.from(this.ports.values())
-						.filter((p) => p.channel)
-						.map((p) => p.channel!.id);
+						.filter((p) => p.channels.size)
+						.flatMap((p) => p.channelIds);
 
 					db.expireDocuments(exemptions);
 				}, getRandomInt(2500, 15000));
@@ -128,21 +124,14 @@ export class WorkerDriver extends EventTarget {
 	emit<T extends WorkerEventName>(type: T, data: WorkerTypedEvent<T>, port?: WorkerPort): void {
 		this.dispatchEvent(new WorkerEvent(type, data, port));
 	}
-
-	public broadcastMessage<T extends WorkerMessageType>(type: T, data: TypedWorkerMessage<T>): void {
-		this.bc.postMessage({
-			type: type,
-			data: data,
-		});
-	}
 }
 
 type WorkerEventName =
 	| "open"
 	| "close"
 	| "idb_ready"
-	| "start_watching_channel"
-	| "stop_watching_channel"
+	| "join_channel"
+	| "part_channel"
 	| "set_channel_presence"
 	| "identity_updated"
 	| "user_updated"
@@ -152,9 +141,9 @@ type WorkerTypedEvent<EVN extends WorkerEventName> = {
 	open: void;
 	close: void;
 	idb_ready: void;
-	start_watching_channel: CurrentChannel;
-	stop_watching_channel: CurrentChannel;
-	set_channel_presence: object;
+	join_channel: CurrentChannel;
+	part_channel: CurrentChannel;
+	set_channel_presence: CurrentChannel;
 	channel_data_fetched: CurrentChannel;
 	identity_updated: TwitchIdentity | YouTubeIdentity;
 	user_updated: SevenTV.User;
diff --git a/src/worker/worker.events.ts b/src/worker/worker.events.ts
index ffa8e88d2..d5e8bb268 100644
--- a/src/worker/worker.events.ts
+++ b/src/worker/worker.events.ts
@@ -11,7 +11,6 @@ export class EventAPI {
 	private transport: EventAPITransport | null = null;
 	private heartbeatInterval: number | null = null;
 	private backoff = 100;
-	private ctx: EventContext;
 
 	sessionID = "";
 	subscriptions: Record<string, SubscriptionRecord[]> = {};
@@ -25,10 +24,12 @@ export class EventAPI {
 		return "TWITCH";
 	}
 
-	constructor(driver: WorkerDriver) {
-		this.ctx = {
-			db: driver.db,
-			driver,
+	constructor(private driver: WorkerDriver) {}
+
+	private getContext(): EventContext {
+		return {
+			db: this.driver.db,
+			driver: this.driver,
 			eventAPI: this,
 		};
 	}
@@ -101,7 +102,7 @@ export class EventAPI {
 	}
 
 	private onDispatch(msg: EventAPIMessage<"DISPATCH">): void {
-		handleDispatchedEvent(this.ctx, msg.data.type, msg.data.body);
+		handleDispatchedEvent(this.getContext(), msg.data.type, msg.data.body);
 
 		log.debugWithObjects(["<EventAPI>", "Dispatch received"], [msg.data]);
 	}
@@ -142,7 +143,7 @@ export class EventAPI {
 
 						for (const sub of rec) {
 							for (const port of sub.ports.values()) {
-								this.subscribe(t, sub.condition, port);
+								for (const channelID of sub.channels) this.subscribe(t, sub.condition, port, channelID);
 							}
 						}
 					}
@@ -168,11 +169,11 @@ export class EventAPI {
 		log.debug("<EventAPI>", "Attempting to resume...", `sessionID=${sessionID}`);
 	}
 
-	subscribe(type: string, condition: Record<string, string>, port: WorkerPort) {
+	subscribe(type: string, condition: Record<string, string>, port: WorkerPort, channelID: string) {
 		const sub = this.findSubscription(type, condition);
 		if (sub) {
-			sub.count++;
 			sub.ports.set(port.id, port);
+			sub.channels.add(channelID);
 			return;
 		}
 
@@ -182,8 +183,8 @@ export class EventAPI {
 
 		this.subscriptions[type].push({
 			condition,
-			count: 1,
 			ports: new Map([[port.id, port]]),
+			channels: new Set([channelID]),
 		});
 
 		this.sendMessage({
@@ -199,9 +200,8 @@ export class EventAPI {
 		const sub = this.findSubscription(type, condition);
 		if (!sub) return;
 
-		sub.count--;
 		sub.ports.delete(port.id);
-		if (sub.count <= 0) {
+		if (sub.ports.size <= 0) {
 			this.subscriptions[type] = this.subscriptions[type].filter((c) => c !== sub);
 
 			this.sendMessage({
@@ -214,6 +214,17 @@ export class EventAPI {
 		}
 	}
 
+	unsubscribeChannel(id: string, port: WorkerPort): void {
+		for (const [type, records] of Object.entries(this.subscriptions)) {
+			for (const rec of records.filter((rec) => rec.channels.has(id))) {
+				rec.channels.delete(id);
+				if (rec.channels.size) continue;
+
+				this.unsubscribe(type, rec.condition, port);
+			}
+		}
+	}
+
 	findSubscription(type: string, condition: Record<string, string>): SubscriptionRecord | null {
 		const sub = this.subscriptions[type];
 		if (!sub) return null;
@@ -221,16 +232,20 @@ export class EventAPI {
 		return sub.find((c) => Object.entries(condition).every(([key, value]) => c.condition[key] === value)) ?? null;
 	}
 
-	findSubscriptionByID(id: number): SubscriptionRecord | null {
+	findSubscriptionByID(id: number[]): SubscriptionRecord[] {
+		const result = [] as SubscriptionRecord[];
+
 		for (const type in this.subscriptions) {
 			const sub = this.subscriptions[type];
 			if (!sub) continue;
 
-			const found = sub.find((c) => c.id === id);
-			if (found) return found;
+			const found = sub.find((c) => typeof c.id === "number" && id.includes(c.id));
+			if (!found) continue;
+
+			result.push(found);
 		}
 
-		return null;
+		return result;
 	}
 
 	sendMessage<O extends keyof typeof EventAPIOpCode>(msg: EventAPIMessage<O>): void {
@@ -283,8 +298,8 @@ export class EventAPI {
 export interface SubscriptionRecord {
 	id?: number;
 	condition: Record<string, string>;
-	count: number;
 	ports: Map<symbol, WorkerPort>;
+	channels: Set<string>;
 	confirmed?: boolean;
 }
 
diff --git a/src/worker/worker.http.ts b/src/worker/worker.http.ts
index a4070f3f1..7b1d16069 100644
--- a/src/worker/worker.http.ts
+++ b/src/worker/worker.http.ts
@@ -37,9 +37,14 @@ export class WorkerHttp {
 	constructor(private driver: WorkerDriver) {
 		this.driver = driver;
 
-		driver.addEventListener("start_watching_channel", (ev) =>
+		driver.addEventListener("join_channel", (ev) =>
 			ev.port ? this.fetchChannelData(ev.detail, ev.port) : undefined,
 		);
+		driver.addEventListener("part_channel", (ev) => {
+			if (!ev.port) return;
+
+			this.driver.eventAPI.unsubscribeChannel(ev.detail.id, ev.port);
+		});
 		driver.addEventListener("identity_updated", async (ev) => {
 			const user = await this.API().seventv.loadUserData(ev.port?.platform ?? "TWITCH", ev.detail.id);
 			if (user && ev.port) {
@@ -47,13 +52,13 @@ export class WorkerHttp {
 			}
 		});
 		driver.addEventListener("set_channel_presence", (ev) => {
-			if (!ev.port || !ev.port.platform || !ev.port.user || !ev.port.channel) return;
-			if (this.lastPresenceAt && this.lastPresenceAt > Date.now() - 1000) {
+			if (!ev.port || !ev.port.platform || !ev.port.user || !ev.detail) return;
+			if (this.lastPresenceAt && this.lastPresenceAt > Date.now() - 1e4) {
 				return;
 			}
 
 			this.lastPresenceAt = Date.now();
-			this.writePresence(ev.port.platform, ev.port.user.id, ev.port.channel.id);
+			this.writePresence(ev.port.platform, ev.port.user.id, ev.detail.id);
 		});
 		driver.addEventListener("imageformat_updated", async (ev) => {
 			if (!ev.port) return;
@@ -148,8 +153,9 @@ export class WorkerHttp {
 					object_id: set.id,
 				},
 				port,
+				channel.id,
 			);
-			if (set.owner) this.driver.eventAPI.subscribe("user.*", { object_id: set.owner.id }, port);
+			if (set.owner) this.driver.eventAPI.subscribe("user.*", { object_id: set.owner.id }, port, channel.id);
 		}
 
 		// begin subscriptions to personal events in the channel
@@ -159,14 +165,14 @@ export class WorkerHttp {
 			id: channel.id,
 		};
 
-		this.driver.eventAPI.subscribe("entitlement.*", cond, port);
-		this.driver.eventAPI.subscribe("cosmetic.*", cond, port);
-		this.driver.eventAPI.subscribe("emote_set.*", cond, port);
+		this.driver.eventAPI.subscribe("entitlement.*", cond, port, channel.id);
+		this.driver.eventAPI.subscribe("cosmetic.*", cond, port, channel.id);
+		this.driver.eventAPI.subscribe("emote_set.*", cond, port, channel.id);
 
 		// Send an initial presence so that the current user immediately has their cosmetics
 		// (sent with "self" property, so that the presence and entitlements are not published)
-		if (port.platform && port.user && port.channel) {
-			this.writePresence(port.platform, port.user.id, port.channel.id, true);
+		if (port.platform && port.user) {
+			this.writePresence(port.platform, port.user.id, channel.id, true);
 		}
 
 		// Send the legacy static cosmetics to the port
diff --git a/src/worker/worker.port.ts b/src/worker/worker.port.ts
index 492fe34f2..374c35863 100644
--- a/src/worker/worker.port.ts
+++ b/src/worker/worker.port.ts
@@ -9,7 +9,7 @@ export class WorkerPort {
 
 	platform: Platform | null = null;
 	providerExtensions = new Set<SevenTV.Provider>();
-	channel: CurrentChannel | null = null;
+	channels = new Map<string, CurrentChannel>();
 	identity: TwitchIdentity | YouTubeIdentity | null = null;
 	user: SevenTV.User | null = null;
 	imageFormat: SevenTV.ImageFormat | null = null;
@@ -25,6 +25,10 @@ export class WorkerPort {
 		this.postMessage("INIT", {});
 	}
 
+	get channelIds(): string[] {
+		return Array.from(this.channels.keys());
+	}
+
 	private onMessage(ev: MessageEvent) {
 		const { type, data } = ev.data as WorkerMessage<WorkerMessageType>;
 
@@ -40,12 +44,19 @@ export class WorkerPort {
 
 					this.driver.emit("identity_updated", this.identity, this);
 				}
-				if (channel) {
-					this.channel = channel;
 
-					this.driver.log.debugWithObjects(["Channel updated"], [this.channel]);
-					this.driver.emit("start_watching_channel", this.channel, this);
+				if (channel && channel.active && !this.channels.has(channel.id)) {
+					this.channels.set(channel.id, channel);
+
+					this.driver.log.debugWithObjects(["Channel added"], [channel]);
+					this.driver.emit("join_channel", channel, this);
+				} else if (channel && !channel.active && this.channels.has(channel.id)) {
+					this.channels.delete(channel.id);
+
+					this.driver.log.debugWithObjects(["Channel removed"], [channel]);
+					this.driver.emit("part_channel", channel, this);
 				}
+
 				if (user) {
 					this.user = user;
 
@@ -59,7 +70,9 @@ export class WorkerPort {
 				break;
 			}
 			case "CHANNEL_ACTIVE_CHATTER": {
-				this.driver.emit("set_channel_presence", {}, this);
+				const { channel } = data as TypedWorkerMessage<"CHANNEL_ACTIVE_CHATTER">;
+
+				this.driver.emit("set_channel_presence", channel, this);
 				break;
 			}
 			case "SYNC_TWITCH_SET": {
@@ -89,8 +102,8 @@ export class WorkerPort {
 				break;
 			}
 			case "CLOSE":
-				if (this.channel) {
-					this.driver.emit("stop_watching_channel", this.channel, this);
+				for (const channel of this.channels.values()) {
+					this.driver.emit("part_channel", channel, this);
 				}
 
 				this.driver.ports.delete(this.id);
diff --git a/vite.config.hosted.ts b/vite.config.hosted.ts
index e5d440521..c84c4d8e6 100644
--- a/vite.config.hosted.ts
+++ b/vite.config.hosted.ts
@@ -61,7 +61,14 @@ export default defineConfig(() => {
 					assetFileNames: `v${fullVersion}/seventv.[name].${fullVersion}.[hash][extname]`,
 					chunkFileNames: `v${fullVersion}/seventv.[name].${fullVersion}.[hash].js`,
 
-					sanitizeFileName: (name: string) => name.toLowerCase(),
+					sanitizeFileName: (name: string) => {
+						return (
+							name
+								.toLowerCase()
+								.match(/^([^?#]+).*/)
+								?.at(1) ?? name
+						);
+					},
 				},
 			},
 		},
diff --git a/vite.config.ts b/vite.config.ts
index 48d21b6fd..9583832ef 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -90,7 +90,7 @@ export default defineConfig(() => {
 						switch (info.name) {
 							// Options Page
 							case "options":
-								return `src/options/options${isDev ? "" : ".js"}`;
+								return `src/app/options/options${isDev ? "" : ".js"}`;
 							// Catch-all, extension scripts
 							default:
 								return path.basename(info.facadeModuleId.replace(".ts", ".js"));
diff --git a/yarn.lock b/yarn.lock
index d9e10eea1..68aeaad16 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -525,10 +525,10 @@
     javascript-natural-sort "0.7.1"
     lodash "^4.17.21"
 
-"@types/chrome@^0.0.235":
-  version "0.0.235"
-  resolved "https://registry.yarnpkg.com/@types/chrome/-/chrome-0.0.235.tgz#9077932147b0a7a739bc1c60c8450b82a25deb2f"
-  integrity sha512-SPj9A4E35SBJICjnL04KZEA/eVr8Km7gbnEfAxzaU2fHpLSnN64OPnfOR3EpDJXXpSORKTn3OUDwugw+rYBBXA==
+"@types/chrome@^0.0.236":
+  version "0.0.236"
+  resolved "https://registry.yarnpkg.com/@types/chrome/-/chrome-0.0.236.tgz#f967769015c458718d4328a54682fa24f0c62c92"
+  integrity sha512-ArQoxO9WtDY6GWcT2cpo+D+hyASPeFt7PHQEUDXwQhRS00Rbop07rnEOA046yws0HkM83Tcew/hW6Dgvnj4iMQ==
   dependencies:
     "@types/filesystem" "*"
     "@types/har-format" "*"
@@ -582,20 +582,20 @@
   dependencies:
     "@types/node" "*"
 
-"@types/marked@^4.3.0":
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/@types/marked/-/marked-4.3.0.tgz#5cd14a190b0a4d212781cfee7093f611ec74a111"
-  integrity sha512-zK4gSFMjgslsv5Lyvr3O1yCjgmnE4pr8jbG8qVn4QglMwtpvPCf4YT2Wma7Nk95OxUUJI8Z+kzdXohbM7mVpGw==
+"@types/marked@^5.0.0":
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/@types/marked/-/marked-5.0.0.tgz#3235b9133054e6586eedabfb77aa7d4a4bafbfcf"
+  integrity sha512-YcZe50jhltsCq7rc9MNZC/4QB/OnA2Pd6hrOSTOFajtabN+38slqgDDCeE/0F83SjkKBQcsZUj7VLWR0H5cKRA==
 
 "@types/minimist@^1.2.0":
   version "1.2.2"
   resolved "https://registry.npmjs.org/@types/minimist/-/minimist-1.2.2.tgz"
   integrity sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ==
 
-"@types/node@*", "@types/node@^20.1.4":
-  version "20.1.4"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.1.4.tgz#83f148d2d1f5fe6add4c53358ba00d97fc4cdb71"
-  integrity sha512-At4pvmIOki8yuwLtd7BNHl3CiWNbtclUbNtScGx4OHfBd4/oWoJC8KRCIxXwkdndzhxOsPXihrsOoydxBjlE9Q==
+"@types/node@*", "@types/node@^20.2.1":
+  version "20.2.1"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.2.1.tgz#de559d4b33be9a808fd43372ccee822c70f39704"
+  integrity sha512-DqJociPbZP1lbZ5SQPk4oag6W7AyaGMO6gSfRwq3PWl4PXTwJpRQJhDq4W0kzrg3w6tJ1SwlvGZ5uKFHY13LIg==
 
 "@types/normalize-package-data@^2.4.0":
   version "2.4.1"
@@ -3058,13 +3058,13 @@ pify@^3.0.0:
   resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176"
   integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==
 
-pinia@^2.0.36:
-  version "2.0.36"
-  resolved "https://registry.yarnpkg.com/pinia/-/pinia-2.0.36.tgz#65130f3b94cc7fe25156308634010fab893dff24"
-  integrity sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ==
+pinia@^2.1.3:
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/pinia/-/pinia-2.1.3.tgz#50c70c7b4c94c109fade0ed4122231cbba72f8c5"
+  integrity sha512-XNA/z/ye4P5rU1pieVmh0g/hSuDO98/a5UC8oSP0DNdvt6YtetJNHTrXwpwsQuflkGT34qKxAEcp7lSxXNjf/A==
   dependencies:
     "@vue/devtools-api" "^6.5.0"
-    vue-demi "*"
+    vue-demi ">=0.14.5"
 
 postcss-html@^1.5.0:
   version "1.5.0"
@@ -3927,16 +3927,16 @@ vite@^4.3.6:
   optionalDependencies:
     fsevents "~2.3.2"
 
-vue-demi@*, vue-demi@^0.13.1:
+vue-demi@>=0.14.0, vue-demi@>=0.14.5:
+  version "0.14.5"
+  resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.5.tgz#676d0463d1a1266d5ab5cba932e043d8f5f2fbd9"
+  integrity sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==
+
+vue-demi@^0.13.1:
   version "0.13.11"
   resolved "https://registry.npmjs.org/vue-demi/-/vue-demi-0.13.11.tgz"
   integrity sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==
 
-vue-demi@>=0.14.0:
-  version "0.14.1"
-  resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.1.tgz#1ed9af03a27642762bfed83d8750805302d0398d"
-  integrity sha512-rt+yuCtXvscYot9SQQj3WKZJVSriPNqVkpVBNEHPzSgBv7QIYzsS410VqVgvx8f9AAPgjg+XPKvmV3vOqqkJQQ==
-
 vue-eslint-parser@^9.1.1, vue-eslint-parser@^9.3.0:
   version "9.3.0"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-9.3.0.tgz#775a974a0603c9a73d85fed8958ed9e814a4a816"