diff --git a/libs/castmate-core/src/info/info-manager.ts b/libs/castmate-core/src/info/info-manager.ts
index 2be70a16..e6265527 100644
--- a/libs/castmate-core/src/info/info-manager.ts
+++ b/libs/castmate-core/src/info/info-manager.ts
@@ -6,7 +6,7 @@ import { defineIPCFunc } from "../util/electron"
 
 import electronUpdater, { autoUpdater, UpdateInfo, CancellationToken } from "electron-updater"
 import { UpdateData } from "castmate-schema"
-import { globalLogger } from "../logging/logging"
+import { globalLogger, usePluginLogger } from "../logging/logging"
 import path from "path"
 
 import semver from "semver"
@@ -15,6 +15,8 @@ interface StartInfo {
 	lastVer: string
 }
 
+const logger = usePluginLogger("info-manager")
+
 export const InfoService = Service(
 	class {
 		startInfo: StartInfo | undefined
@@ -81,18 +83,23 @@ export const InfoService = Service(
 		}
 
 		async checkUpdate() {
-			const result = await autoUpdater.checkForUpdates()
-			if (result != null) {
-				if (semver.gt(result.updateInfo.version, app.getVersion())) {
-					globalLogger.log("Update!", result.updateInfo.releaseName, result.updateInfo.version)
-					this.updateInfo = result.updateInfo
-					return true
+			try {
+				const result = await autoUpdater.checkForUpdates()
+				if (result != null) {
+					if (semver.gt(result.updateInfo.version, app.getVersion())) {
+						globalLogger.log("Update!", result.updateInfo.releaseName, result.updateInfo.version)
+						this.updateInfo = result.updateInfo
+						return true
+					}
+					return false
+				} else {
+					globalLogger.log("No Update :(")
 				}
 				return false
-			} else {
-				globalLogger.log("No Update :(")
+			} catch (err) {
+				logger.error("Error Checking Update", err)
+				return false
 			}
-			return false
 		}
 
 		async checkInfo() {
diff --git a/libs/castmate-core/src/media/media-manager.ts b/libs/castmate-core/src/media/media-manager.ts
index 5bfcf8e1..9f131155 100644
--- a/libs/castmate-core/src/media/media-manager.ts
+++ b/libs/castmate-core/src/media/media-manager.ts
@@ -1,6 +1,7 @@
 import { Service } from "../util/service"
 import { ImageFormats, MediaMetadata, stillImageFormats } from "castmate-schema"
 import * as fs from "fs/promises"
+import * as fsSync from "fs"
 import path, * as pathTools from "path"
 import * as rra from "recursive-readdir-async"
 import * as ffmpeg from "fluent-ffmpeg"
@@ -10,11 +11,15 @@ import { ensureDirectory, resolveProjectPath } from "../io/file-system"
 import { shell, app } from "electron"
 import { globalLogger, usePluginLogger } from "../logging/logging"
 import { WebService } from "../webserver/internal-webserver"
-import express, { Application, Router } from "express"
+import express, { Application, response, Router } from "express"
+import { coreAxios } from "../util/request-utils"
 //require("@ffmpeg-installer/win32-x64")
 //require("@ffprobe-installer/win32-x64")
 //Thumbnails?
 //Durations?
+
+import http from "http"
+
 const logger = usePluginLogger("media")
 
 function probeMedia(file: string) {
@@ -37,6 +42,69 @@ export interface MediaFolder {
 	path: string
 	watcher: chokidar.FSWatcher
 }
+/*
+function downloadFile(url: string, dest: string) {
+	return new Promise<void>((resolve, reject) => {
+		const writeStream = fsSync.createWriteStream(dest)
+
+		const request = http.get(url, (resp) => {
+			if (resp.statusCode !== 200) {
+				reject(`Failed to download ${url} with ${resp.statusCode}`)
+			}
+
+			resp.pipe(writeStream)
+		})
+
+		writeStream.on("finish", () => {
+			writeStream.close((err) => {
+				if (err) return reject(err)
+				resolve()
+			})
+		})
+
+		request.on("error", (err) => {
+			fsSync.unlink(dest, (unlinkErr) => {
+				if (unlinkErr) return reject(unlinkErr)
+				reject(err)
+			})
+		})
+
+		writeStream.on("error", (err) => {
+			fsSync.unlink(dest, (unlinkErr) => {
+				if (unlinkErr) return reject(unlinkErr)
+				reject(err)
+			})
+		})
+	})
+}*/
+
+async function downloadFile(url: string, dest: string) {
+	const writeStream = fsSync.createWriteStream(dest)
+	//https://stackoverflow.com/questions/55374755/node-js-axios-download-file-stream-and-writefile
+	await coreAxios
+		.get(url, {
+			responseType: "stream",
+		})
+		.then((response) => {
+			return new Promise<boolean>((resolve, reject) => {
+				response.data.pipe(writeStream)
+
+				let error: any = undefined
+				writeStream.on("error", (err) => {
+					error = err
+					writeStream.close()
+					reject(err)
+				})
+				writeStream.on("close", () => {
+					if (!error) {
+						resolve(true)
+					}
+					//no need to call the reject here, as it will have been called in the
+					//'error' stream;
+				})
+			})
+		})
+}
 
 export const MediaManager = Service(
 	class {
@@ -62,11 +130,55 @@ export const MediaManager = Service(
 				shell.showItemInFolder(mediaItem.file)
 			})
 
+			defineIPCFunc("media", "downloadMedia", async (url: string, mediaPath: string) => {
+				await this.downloadMedia(url, mediaPath)
+			})
+
+			defineIPCFunc("media", "copyMedia", async (localPath: string, mediaPath: string) => {
+				await this.copyMedia(localPath, mediaPath)
+			})
+
 			const router = express.Router()
 			router.use(express.static(mediaPath))
 			WebService.getInstance().addRootRouter("/media/default", router)
 		}
 
+		getLocalPath(mediaPath: string) {
+			const baseMediaPath = resolveProjectPath("./media")
+
+			if (!mediaPath.startsWith("/default")) throw new Error("not a media path")
+
+			const defaultPath = path.relative("/default", mediaPath)
+
+			const localPath = path.join(baseMediaPath, defaultPath)
+
+			return localPath
+		}
+
+		async downloadMedia(url: string, mediaPath: string) {
+			try {
+				const localPath = this.getLocalPath(mediaPath)
+
+				logger.log("Downloading Media", url, "to", localPath)
+
+				await downloadFile(url, localPath)
+			} catch (err) {
+				logger.error("ERROR DOWNLOADING MEDIA", err)
+			}
+		}
+
+		async copyMedia(localPath: string, mediaPath: string) {
+			try {
+				const destPath = this.getLocalPath(mediaPath)
+
+				logger.log("Copying Media", localPath, "to", destPath)
+
+				await fs.copyFile(localPath, destPath)
+			} catch (err) {
+				logger.error("ERROR COPYING MEDIA", err)
+			}
+		}
+
 		getMedia(path: string) {
 			return this.mediaFiles.get(path)
 		}
diff --git a/libs/castmate-ui-core/src/components/automation/DefaultActionComponent.vue b/libs/castmate-ui-core/src/components/automation/DefaultActionComponent.vue
index 7b6e5524..fbe0a6d3 100644
--- a/libs/castmate-ui-core/src/components/automation/DefaultActionComponent.vue
+++ b/libs/castmate-ui-core/src/components/automation/DefaultActionComponent.vue
@@ -1,7 +1,7 @@
 <template>
 	<div class="action-preview-container">
 		<div class="cropper">
-			<data-view v-if="actionInfo" :model-value="modelValue" :schema="actionInfo.config" />
+			<data-view v-if="actionInfo" :model-value="modelValue" :schema="actionInfo.config" :context="modelValue" />
 		</div>
 	</div>
 </template>
diff --git a/libs/castmate-ui-core/src/components/data/views/EnumableDataView.vue b/libs/castmate-ui-core/src/components/data/views/EnumableDataView.vue
new file mode 100644
index 00000000..b86199c8
--- /dev/null
+++ b/libs/castmate-ui-core/src/components/data/views/EnumableDataView.vue
@@ -0,0 +1,68 @@
+<template>
+	<span class="data-label" v-if="schema.name">{{ schema.name }}: </span>{{ dataView }}
+</template>
+
+<script setup lang="ts">
+import { SchemaBase, Enumable, EnumItem } from "castmate-schema"
+import { SharedDataViewProps } from "../../../main"
+import { computed, ref, watch, onMounted } from "vue"
+import _isFunction from "lodash/isFunction"
+
+const props = defineProps<
+	{
+		modelValue: any
+		schema: SchemaBase & Enumable<any>
+	} & SharedDataViewProps
+>()
+
+const fetching = ref(false)
+
+const dynamicItem = ref<EnumItem<any>>()
+
+function findItem(arr: Array<EnumItem<any>>) {
+	return arr.find((v) => {
+		if (typeof v == "object" && "value" in v) return v.value == props.modelValue
+		return v == props.modelValue
+	})
+}
+
+onMounted(() => {
+	watch(
+		() => props.modelValue,
+		() => {
+			fetchItem()
+		},
+		{ immediate: true }
+	)
+})
+
+//TODO: Is there a better way to
+async function fetchItem() {
+	const enumable = props.schema as Enumable<any>
+	if (!enumable.enum) return
+
+	if (!_isFunction(enumable.enum)) {
+		const item = findItem(enumable.enum)
+		dynamicItem.value = item
+		return
+	}
+
+	console.log("Do Fetch ITEM!")
+	fetching.value = true
+	try {
+		const items = await enumable.enum(props.context)
+		console.log("ITEMS", items, props.context)
+		const item = findItem(items)
+		dynamicItem.value = item
+		return
+	} catch (err) {
+		console.error("FETCH ERROR", err)
+	}
+	fetching.value = false
+}
+
+const dataView = computed(() => {
+	if (props.schema.enum == null) return props.modelValue
+	return dynamicItem.value?.name ?? dynamicItem.value ?? props.modelValue
+})
+</script>
diff --git a/libs/castmate-ui-core/src/components/document/DocumentEditor.vue b/libs/castmate-ui-core/src/components/document/DocumentEditor.vue
index 9b590979..5fa03edb 100644
--- a/libs/castmate-ui-core/src/components/document/DocumentEditor.vue
+++ b/libs/castmate-ui-core/src/components/document/DocumentEditor.vue
@@ -4,7 +4,6 @@
 		v-if="documentComponent && document"
 		v-model="documentData"
 		v-model:view="documentView"
-		@keydown="onKeyDown"
 		tabindex="-1"
 	/>
 </template>
@@ -57,12 +56,6 @@ const documentView = computed({
 		document.value.viewData = data
 	},
 })
-
-function onKeyDown(ev: KeyboardEvent) {
-	if (ev.ctrlKey && ev.code == "KeyS") {
-		documentStore.saveDocument(props.documentId)
-	}
-}
 </script>
 
 <style scoped></style>
diff --git a/libs/castmate-ui-core/src/components/resources/ResourceEditDialog.vue b/libs/castmate-ui-core/src/components/resources/ResourceEditDialog.vue
index dd42759b..d1d58c36 100644
--- a/libs/castmate-ui-core/src/components/resources/ResourceEditDialog.vue
+++ b/libs/castmate-ui-core/src/components/resources/ResourceEditDialog.vue
@@ -1,6 +1,18 @@
 <template>
 	<div ref="container" class="dialog-container">
-		<component :is="resource?.editDialog" :resourceType="resourceType" :resourceId="resourceId" v-model="config" />
+		<component
+			v-if="resource?.editDialog"
+			:is="resource.editDialog"
+			:resourceType="resourceType"
+			:resourceId="resourceId"
+			v-model="config"
+		/>
+		<div class="p-inputgroup mt-5" v-else>
+			<span class="p-float-label">
+				<p-input-text id="l" v-model="config" ref="nameInput" autofocus />
+				<label for="l"> Name </label>
+			</span>
+		</div>
 		<div class="flex justify-content-end mt-1">
 			<p-button :label="isCreate ? 'Create' : 'Save'" @click="submit"></p-button>
 		</div>
@@ -11,6 +23,7 @@
 import { computed, onMounted, ref } from "vue"
 import { provideScrollAttachable, useDialogRef, useResourceData } from "../../main"
 import PButton from "primevue/button"
+import PInputText from "primevue/inputtext"
 import { constructDefault } from "castmate-schema"
 
 const props = defineProps<{}>()
diff --git a/libs/castmate-ui-core/src/media/media-store.ts b/libs/castmate-ui-core/src/media/media-store.ts
index fbadfaf7..694fb441 100644
--- a/libs/castmate-ui-core/src/media/media-store.ts
+++ b/libs/castmate-ui-core/src/media/media-store.ts
@@ -1,8 +1,10 @@
 import { defineStore } from "pinia"
-import { computed, ref } from "vue"
+import { computed, MaybeRefOrGetter, Ref, ref, toValue } from "vue"
 import { MediaMetadata } from "castmate-schema"
 import { ProjectItem, handleIpcMessage, useDockingStore, useIpcCaller, useIpcMessage, useProjectStore } from "../main"
 import MediaBrowserPage from "../components/media/MediaBrowserPage.vue"
+import { useFileDragDrop } from "../util/file-drop"
+import path from "path"
 
 export const useMediaStore = defineStore("media", () => {
 	const mediaMap = ref<Record<string, MediaMetadata>>({})
@@ -11,6 +13,9 @@ export const useMediaStore = defineStore("media", () => {
 	const openMediaFolder = useIpcCaller<() => any>("media", "openMediaFolder")
 	const exploreMediaItem = useIpcCaller<(path: string) => any>("media", "exploreMediaItem")
 
+	const downloadMediaMain = useIpcCaller<(url: string, mediaPath: string) => any>("media", "downloadMedia")
+	const copyMediaMain = useIpcCaller<(localPath: string, mediaPath: string) => any>("media", "copyMedia")
+
 	const projectStore = useProjectStore()
 	const dockingStore = useDockingStore()
 
@@ -45,5 +50,59 @@ export const useMediaStore = defineStore("media", () => {
 		projectStore.registerProjectGroupItem(projectItem)
 	}
 
-	return { initialize, media: computed(() => mediaMap.value), openMediaFolder, exploreMediaItem }
+	async function downloadMedia(path: string, mediaPath: string) {
+		await downloadMediaMain(path, mediaPath)
+	}
+
+	async function copyMedia(localPath: string, mediaPath: string) {
+		await copyMediaMain(localPath, mediaPath)
+	}
+
+	return {
+		initialize,
+		media: computed(() => mediaMap.value),
+		openMediaFolder,
+		exploreMediaItem,
+		downloadMedia,
+		copyMedia,
+	}
 })
+
+export function useMediaDrop(element: Ref<HTMLElement | undefined>, subPath: MaybeRefOrGetter<string>) {
+	const mediaStore = useMediaStore()
+
+	return useFileDragDrop(element, (files) => {
+		const basepath = toValue(subPath)
+
+		for (const file of files) {
+			console.log("DROP", file)
+			if (
+				!(
+					file.mimetype.startsWith("image") ||
+					file.mimetype.startsWith("audio") ||
+					file.mimetype.startsWith("video")
+				)
+			)
+				continue
+
+			const pathParse = path.parse(file.path)
+
+			const mediaName = pathParse.base
+
+			const proposedMediaPath = path.join(basepath, mediaName).replaceAll("\\", "/")
+
+			if (mediaStore.media[proposedMediaPath]) {
+				console.log("ALREADY HAS PATH", proposedMediaPath)
+				continue
+			}
+
+			if (file.remote) {
+				console.log("DOWNLOAD", file.path, "to", proposedMediaPath)
+				mediaStore.downloadMedia(file.path, proposedMediaPath)
+			} else {
+				console.log("COPY", file.path, "to", proposedMediaPath)
+				mediaStore.copyMedia(file.path, proposedMediaPath)
+			}
+		}
+	})
+}
diff --git a/libs/castmate-ui-core/src/project/project-store.ts b/libs/castmate-ui-core/src/project/project-store.ts
index eb4ba13c..bc68cc6d 100644
--- a/libs/castmate-ui-core/src/project/project-store.ts
+++ b/libs/castmate-ui-core/src/project/project-store.ts
@@ -1,8 +1,9 @@
 import { defineStore } from "pinia"
 import { shallowRef, ComputedRef, computed, ref, App, VueElementConstructor, Component, toValue } from "vue"
-import { NamedData, useDockingStore, useResourceData, useResourceStore } from "../main"
+import { NamedData, useDockingStore, useResourceCreateDialog, useResourceData, useResourceStore } from "../main"
 import NameDialogVue from "../components/dialogs/NameDialog.vue"
 import { ResourceData } from "castmate-schema"
+import ResourceEditDialog from "../components/resources/ResourceEditDialog.vue"
 
 export interface ProjectItem {
 	id: string
@@ -99,31 +100,15 @@ export function getResourceAsDirectProjectGroup<TData extends ResourceData>(
 
 		const title = config.resourceName ?? config.resourceType
 
+		const createDialog = useResourceCreateDialog(config.resourceType, app.config.globalProperties.$dialog)
+
 		return {
 			id: config.resourceType,
 			title,
 			icon: config.groupIcon,
 			items,
 			create() {
-				const dialog = app.config.globalProperties.$dialog
-				if (!resources.value) return
-				dialog.open(config.creationDialog ?? NameDialogVue, {
-					props: {
-						header: `New ${title}`,
-						style: {
-							width: "25vw",
-						},
-						modal: true,
-					},
-					onClose(options) {
-						if (!options?.data) {
-							return
-						}
-
-						console.log("Creating", config.resourceType, options.data)
-						resourceStore.createResource(config.resourceType, options.data)
-					},
-				})
+				createDialog()
 			},
 		}
 	})
@@ -139,7 +124,7 @@ export function getResourceAsProjectGroup<TData extends ResourceData>(
 	const resourceStore = useResourceStore()
 	const dockingStore = useDockingStore()
 
-	const group = computed<ProjectGroup>(() => {
+	const group = computed<ProjectGroup>((): ProjectGroup => {
 		let items: ProjectItem[] = []
 		if (resources.value) {
 			const resourceItems = [...resources.value.resources.values()]
@@ -168,31 +153,15 @@ export function getResourceAsProjectGroup<TData extends ResourceData>(
 
 		const title = config.resourceName ?? config.resourceType
 
+		const createDialog = useResourceCreateDialog(config.resourceType, app.config.globalProperties.$dialog)
+
 		return {
 			id: config.resourceType,
-			title: config.resourceName,
+			title,
 			icon: config.groupIcon,
 			items,
 			create() {
-				const dialog = app.config.globalProperties.$dialog
-				if (!resources.value) return
-				dialog.open(config.creationDialog ?? NameDialogVue, {
-					props: {
-						header: `New ${title}`,
-						style: {
-							width: "25vw",
-						},
-						modal: true,
-					},
-					onClose(options) {
-						if (!options?.data) {
-							return
-						}
-
-						console.log("Creating", config.resourceType, options.data)
-						resourceStore.createResource(config.resourceType, options.data)
-					},
-				})
+				createDialog()
 			},
 		}
 	})
diff --git a/libs/castmate-ui-core/src/resources/resource-store.ts b/libs/castmate-ui-core/src/resources/resource-store.ts
index dad39c02..3264a945 100644
--- a/libs/castmate-ui-core/src/resources/resource-store.ts
+++ b/libs/castmate-ui-core/src/resources/resource-store.ts
@@ -7,6 +7,7 @@ import { ResourceData, Schema } from "castmate-schema"
 import { useDialog } from "primevue/usedialog"
 import { useConfirm } from "primevue/useconfirm"
 import ResourceEditDialogVue from "../components/resources/ResourceEditDialog.vue"
+import { DialogServiceMethods } from "primevue/dialogservice"
 
 interface ResourceStorage<TResourceData extends ResourceData = ResourceData> {
 	resources: Map<string, TResourceData>
@@ -223,9 +224,12 @@ export function useResource<TResourceData extends ResourceData>(
 	})
 }
 
-export function useResourceCreateDialog(resourceType: MaybeRefOrGetter<string | undefined>) {
+export function useResourceCreateDialog(
+	resourceType: MaybeRefOrGetter<string | undefined>,
+	dialogService?: DialogServiceMethods
+) {
 	const resourceStore = useResourceStore()
-	const dialog = useDialog()
+	const dialog = dialogService ?? useDialog()
 
 	function open() {
 		const resourceName = toValue(resourceType)
diff --git a/libs/castmate-ui-core/src/util/data.ts b/libs/castmate-ui-core/src/util/data.ts
index 06c62981..366d4d47 100644
--- a/libs/castmate-ui-core/src/util/data.ts
+++ b/libs/castmate-ui-core/src/util/data.ts
@@ -56,7 +56,7 @@ import DurationInputVue from "../components/data/inputs/DurationInput.vue"
 import DynamicTypeInputVue from "../components/data/inputs/DynamicTypeInput.vue"
 import DirectoryInputVue from "../components/data/inputs/DirectoryInput.vue"
 
-import GenericDataViewVue from "../components/data/views/GenericDataView.vue"
+import EnumableDataView from "../components/data/views/EnumableDataView.vue"
 import BooleanViewVue from "../components/data/views/BooleanView.vue"
 import ColorViewVue from "../components/data/views/ColorView.vue"
 import DurationViewVue from "../components/data/views/DurationView.vue"
@@ -342,8 +342,8 @@ export function initData() {
 	inputStore.registerInputComponent(FilePath, FilePathInputVue)
 	inputStore.registerInputComponent(Command, CommandInputVue)
 
-	inputStore.registerViewComponent(String, GenericDataViewVue)
-	inputStore.registerViewComponent(Number, GenericDataViewVue)
+	inputStore.registerViewComponent(String, EnumableDataView)
+	inputStore.registerViewComponent(Number, EnumableDataView)
 	inputStore.registerViewComponent(Boolean, BooleanViewVue)
 	inputStore.registerViewComponent(Object, ObjectViewVue)
 	inputStore.registerViewComponent(Range, RangeViewVue)
diff --git a/libs/castmate-ui-core/src/util/file-drop.ts b/libs/castmate-ui-core/src/util/file-drop.ts
new file mode 100644
index 00000000..511ea4b7
--- /dev/null
+++ b/libs/castmate-ui-core/src/util/file-drop.ts
@@ -0,0 +1,120 @@
+import { useEventListener } from "@vueuse/core"
+import { computed, ref, Ref, toValue } from "vue"
+
+interface FromTo {
+	fromElement?: HTMLElement
+	toElement?: HTMLElement
+}
+export interface DroppedFile {
+	path: string
+	mimetype: string
+	remote: boolean
+}
+
+export type FileDropEvent = (files: DroppedFile[]) => any
+
+async function getMimeType(url: string) {
+	console.log("Getting Mimetype", url)
+	const response = await fetch(url, { method: "HEAD" })
+
+	if (!response.ok) return undefined
+
+	return response.headers.get("Content-Type") ?? undefined
+}
+
+export function useFileDragDrop(element: Ref<HTMLElement | undefined>, onDrop: FileDropEvent) {
+	const hoveringFiles = ref(false)
+
+	useEventListener(element, "dragenter", (ev: DragEvent) => {
+		if (!ev.dataTransfer || !ev.dataTransfer.types.includes("Files")) return
+
+		const elem = toValue(element)
+		if (!elem) return
+
+		const ft = ev as FromTo
+		const fromIn = ft.fromElement != null && elem.contains(ft.fromElement)
+
+		if (fromIn) {
+			return
+		}
+
+		ev.preventDefault()
+		ev.stopPropagation()
+
+		console.log("FileEnter", ev, ev.dataTransfer.files)
+		hoveringFiles.value = true
+	})
+
+	useEventListener(element, "dragleave", (ev: DragEvent) => {
+		if (!ev.dataTransfer || !ev.dataTransfer.types.includes("Files")) return
+
+		const elem = toValue(element)
+		if (!elem) return
+
+		const ft = ev as FromTo
+		const fromIn = ft.fromElement != null && elem.contains(ft.fromElement)
+
+		if (fromIn) {
+			return
+		}
+
+		ev.preventDefault()
+		ev.stopPropagation()
+
+		console.log("FileLeave", ev, ev.dataTransfer.files)
+		hoveringFiles.value = false
+	})
+
+	useEventListener(element, "dragover", (ev: DragEvent) => {
+		if (!ev.dataTransfer || !ev.dataTransfer.types.includes("Files")) return
+
+		ev.preventDefault()
+		ev.stopPropagation()
+
+		ev.dataTransfer.dropEffect = "copy"
+	})
+
+	useEventListener(element, "drop", async (ev: DragEvent) => {
+		if (!ev.dataTransfer || !ev.dataTransfer.types.includes("Files")) return
+
+		hoveringFiles.value = false
+
+		ev.preventDefault()
+		ev.stopPropagation()
+
+		const urlList = ev.dataTransfer.getData("text/uri-list")
+
+		const result: DroppedFile[] = []
+
+		if (urlList) {
+			const urls = urlList.split("\n").map((u) => u.trim())
+			const mimetypes = await Promise.allSettled(urls.map((url) => getMimeType(url)))
+
+			for (let i = 0; i < mimetypes.length; ++i) {
+				const mimetypeResult = mimetypes[i]
+				if (mimetypeResult.status != "fulfilled") {
+					continue
+				}
+
+				const url = urls[i]
+				const mimetype = mimetypeResult.value
+
+				if (mimetype == undefined) continue
+
+				result.push({ path: url, mimetype, remote: true })
+			}
+		} else {
+			for (const file of ev.dataTransfer.files) {
+				if (file.path && file.type) {
+					result.push({ path: file.path, mimetype: file.type, remote: false })
+				}
+			}
+		}
+
+		onDrop(result)
+	})
+
+	return {
+		hoveringFiles: computed(() => hoveringFiles.value),
+	}
+}
diff --git a/package.json b/package.json
index d089aa98..b43ae9ff 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "castmate-monorepo",
-	"version": "0.5.2",
+	"version": "0.5.3-beta",
 	"description": "",
 	"private": true,
 	"type": "module",
diff --git a/packages/castmate/package.json b/packages/castmate/package.json
index 3f6105bc..85d14f3b 100644
--- a/packages/castmate/package.json
+++ b/packages/castmate/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "castmate",
-	"version": "0.5.2",
+	"version": "0.5.3-beta",
 	"description": "CastMate",
 	"author": "LordTocs",
 	"scripts": {
diff --git a/packages/castmate/src/renderer/App.vue b/packages/castmate/src/renderer/App.vue
index 792f84aa..2cb66be8 100644
--- a/packages/castmate/src/renderer/App.vue
+++ b/packages/castmate/src/renderer/App.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="app">
+	<div class="app" @keydown="onKeyDown" tabindex="-1">
 		<system-bar title="Hello World"></system-bar>
 		<div class="app-row" v-if="initStore.inited">
 			<project-view />
@@ -25,6 +25,8 @@ import {
 	useIpcCaller,
 	CancellableDynamicDialog,
 	useIpcMessage,
+	useSaveActiveTab,
+	useSaveAllTabs,
 } from "castmate-ui-core"
 import ProjectView from "./components/project/ProjectView.vue"
 
@@ -130,6 +132,19 @@ onMounted(async () => {
 		}
 	}
 })
+
+const saveActiveTab = useSaveActiveTab()
+const saveAllTabs = useSaveAllTabs()
+
+function onKeyDown(ev: KeyboardEvent) {
+	if (ev.ctrlKey && ev.code == "KeyS") {
+		if (ev.shiftKey) {
+			saveAllTabs()
+		} else {
+			saveActiveTab()
+		}
+	}
+}
 </script>
 
 <style>
diff --git a/packages/castmate/src/renderer/components/profiles/TriggerEdit.vue b/packages/castmate/src/renderer/components/profiles/TriggerEdit.vue
index b7d59f5b..61c74792 100644
--- a/packages/castmate/src/renderer/components/profiles/TriggerEdit.vue
+++ b/packages/castmate/src/renderer/components/profiles/TriggerEdit.vue
@@ -4,7 +4,7 @@
 			<div class="drag-handle">
 				<i class="mdi mdi-drag" style="font-size: 2.5rem; line-height: 2.5rem" />
 			</div>
-			<div class="flex flex-row flex-grow-1 align-items-center" v-if="!open">
+			<div class="flex flex-row flex-grow-1 align-items-center" v-if="!open" @dblclick="open = !open">
 				<span class="trigger-name">
 					<i :class="[trigger?.icon]" />
 					{{ trigger?.name }}
@@ -51,7 +51,7 @@
 				:container="cardBody"
 			></expander-slider>
 		</div>
-		<div class="closed-body" v-else>
+		<div class="closed-body" v-else @dblclick="open = !open">
 			<div style="width: 50%">
 				<data-view v-if="trigger" :model-value="modelValue.config" :schema="trigger.config" />
 			</div>
diff --git a/plugins/obs/main/package.json b/plugins/obs/main/package.json
index b5e6ce33..0af37d5d 100644
--- a/plugins/obs/main/package.json
+++ b/plugins/obs/main/package.json
@@ -18,7 +18,7 @@
     "castmate-schema": "workspace:^",
     "jsqr": "^1.4.0",
     "node-screenshots": "^0.2.0",
-    "obs-websocket-js": "^5.0.5",
+    "obs-websocket-js": "^5.0.6",
     "regedit": "^5.1.3"
   }
 }
diff --git a/plugins/obs/main/src/connection.ts b/plugins/obs/main/src/connection.ts
index 4426f142..6182604d 100644
--- a/plugins/obs/main/src/connection.ts
+++ b/plugins/obs/main/src/connection.ts
@@ -10,7 +10,7 @@ import {
 	AnalyticsService,
 	InfoService,
 } from "castmate-core"
-import OBSWebSocket from "obs-websocket-js"
+import OBSWebSocket, { OBSWebSocketError } from "obs-websocket-js"
 import {
 	OBSConnectionConfig,
 	OBSConnectionState,
@@ -207,21 +207,25 @@ export class OBSConnection extends FileResource<OBSConnectionConfig, OBSConnecti
 
 		this.connection.on("Identified", (ev) => {
 			logger.log("OBS Identified Ver:", ev.negotiatedRpcVersion)
-			this.state.connected = true
 
 			this.queryInitialStateLoop()
 		})
 	}
 
 	private async queryInitialStateLoop() {
-		for (let i = 0; i < 20; ++i) {
+		for (let i = 0; i < 40; ++i) {
 			try {
 				await this.queryInitialState()
 				return
 			} catch (err) {
-				//We probably got a not ready error?
+				if (err.code == 207) {
+					logger.log(err.message)
+				} else {
+					logger.error("Error Trying Initial State Check", err)
+				}
 			}
 			await sleep(1000)
+			logger.log("Retrying...")
 		}
 	}
 
@@ -243,6 +247,9 @@ export class OBSConnection extends FileResource<OBSConnectionConfig, OBSConnecti
 		const sceneResp = await this.connection.call("GetCurrentProgramScene")
 		this.state.scene = sceneResp.currentProgramSceneName
 		this.sceneHistory.reset(sceneResp.currentProgramSceneName)
+
+		this.state.connected = true
+		logger.log("Initial OBS State Queried, Connected Successfully")
 	}
 
 	private nextTickConnect(hostname: string, port: number, password?: string) {
@@ -306,6 +313,21 @@ export class OBSConnection extends FileResource<OBSConnectionConfig, OBSConnecti
 		}
 	}
 
+	async getSceneAndGroupNames(): Promise<string[]> {
+		try {
+			logger.log("Fetching Scene/Group Names")
+			const [sceneResp, groupResp] = await Promise.all([
+				this.connection.call("GetSceneList"),
+				this.connection.call("GetGroupList"),
+			])
+			const scenes = sceneResp.scenes as unknown as OBSSceneListItem[]
+			const groups = groupResp.groups as unknown as string[]
+			return [...scenes.map((s) => s.sceneName).reverse(), ...groups]
+		} catch (err) {
+			return []
+		}
+	}
+
 	async getInputs(inputKinds?: string | string[]): Promise<string[]> {
 		try {
 			if (Array.isArray(inputKinds)) {
@@ -343,7 +365,21 @@ export class OBSConnection extends FileResource<OBSConnectionConfig, OBSConnecti
 				value: i.sceneItemId,
 			}))
 		} catch (err) {
-			return []
+			try {
+				const resp = await this.connection.call("GetGroupSceneItemList", { sceneName })
+				let items = resp.sceneItems as unknown as OBSWSSceneItem[]
+				if (Array.isArray(inputKinds)) {
+					items = items.filter((i) => inputKinds.includes(i.inputKind))
+				} else if (inputKinds) {
+					items = items.filter((i) => i.inputKind == inputKinds)
+				}
+				return items.map((i) => ({
+					name: i.sourceName,
+					value: i.sceneItemId,
+				}))
+			} catch (err) {
+				return []
+			}
 		}
 	}
 
@@ -431,6 +467,8 @@ export class OBSConnection extends FileResource<OBSConnectionConfig, OBSConnecti
 	async findBrowserByUrlPattern(urlPattern: string) {
 		if (!this.state.connected) return undefined
 
+		console.log("Attempting Browser Find")
+
 		const { inputs } = await this.connection.call("GetInputList", {
 			inputKind: "browser_source",
 		})
diff --git a/plugins/obs/main/src/media.ts b/plugins/obs/main/src/media.ts
index aca102df..d0b772a1 100644
--- a/plugins/obs/main/src/media.ts
+++ b/plugins/obs/main/src/media.ts
@@ -139,7 +139,7 @@ export function setupMedia(obsDefault: ReactiveRef<OBSConnection>) {
 					type: String,
 					required: true,
 					async enum(context: { obs: OBSConnection }) {
-						return (await context?.obs?.getSceneNames()) ?? []
+						return (await context?.obs?.getSceneAndGroupNames()) ?? []
 					},
 				},
 				source: {
@@ -200,4 +200,30 @@ export function setupMedia(obsDefault: ReactiveRef<OBSConnection>) {
 			})
 		},
 	})
+
+	defineAction({
+		id: "chapterMarker",
+		name: "Chapter Marker",
+		description: "Creates a Chapter Marker in the OBS recording",
+		icon: "mdi mdi-map-marker",
+		config: {
+			type: Object,
+			properties: {
+				obs: {
+					type: OBSConnection,
+					name: "OBS Connection",
+					required: true,
+					default: () => obsDefault.value,
+				},
+				chapterName: {
+					type: String,
+					name: "Chapter Name",
+					template: true,
+				},
+			},
+		},
+		async invoke(config, contextData, abortSignal) {
+			await config.obs?.connection?.call("CreateRecordChapter", { chapterName: config.chapterName })
+		},
+	})
 }
diff --git a/plugins/obs/main/src/scenes.ts b/plugins/obs/main/src/scenes.ts
index 3fa6c7e5..5b5ac95d 100644
--- a/plugins/obs/main/src/scenes.ts
+++ b/plugins/obs/main/src/scenes.ts
@@ -22,7 +22,7 @@ export function setupScenes(obsDefault: ReactiveRef<OBSConnection>) {
 					required: true,
 					//template: true,
 					async enum(context: { obs: OBSConnection }) {
-						return (await context?.obs?.getSceneNames()) ?? []
+						return (await context?.obs?.getSceneAndGroupNames()) ?? []
 					},
 				},
 			},
diff --git a/plugins/obs/main/src/sources.ts b/plugins/obs/main/src/sources.ts
index 27088a92..6c999f2d 100644
--- a/plugins/obs/main/src/sources.ts
+++ b/plugins/obs/main/src/sources.ts
@@ -23,7 +23,7 @@ export function setupSources(obsDefault: ReactiveRef<OBSConnection>) {
 					name: "Scene",
 					template: true,
 					async enum(context: { obs: OBSConnection }) {
-						return (await context?.obs?.getSceneNames()) ?? []
+						return (await context?.obs?.getSceneAndGroupNames()) ?? []
 					},
 				},
 				source: {
@@ -286,7 +286,7 @@ export function setupSources(obsDefault: ReactiveRef<OBSConnection>) {
 						const obs = context?.obs?.connection
 						if (!obs) return []
 
-						const textInputs = await context.obs.getInputs("text_gdiplus_v2")
+						const textInputs = await context.obs.getInputs(["text_gdiplus_v2", "text_gdiplus_v3"])
 						return textInputs
 					},
 				},
@@ -295,6 +295,7 @@ export function setupSources(obsDefault: ReactiveRef<OBSConnection>) {
 					name: "Text",
 					template: true,
 					required: true,
+					multiLine: true,
 					default: "",
 				},
 			},
diff --git a/plugins/obs/main/src/transform.ts b/plugins/obs/main/src/transform.ts
index ac7982d9..24dc7e4a 100644
--- a/plugins/obs/main/src/transform.ts
+++ b/plugins/obs/main/src/transform.ts
@@ -26,7 +26,7 @@ export function setupTransforms(obsDefault: ReactiveRef<OBSConnection>) {
 					required: true,
 					name: "Scene",
 					async enum(context: { obs: OBSConnection }) {
-						return (await context?.obs?.getSceneNames()) ?? []
+						return (await context?.obs?.getSceneAndGroupNames()) ?? []
 					},
 				},
 				source: {
diff --git a/plugins/obs/renderer/src/components/DashboardObsCard.vue b/plugins/obs/renderer/src/components/DashboardObsCard.vue
index 15e52546..8eb7e617 100644
--- a/plugins/obs/renderer/src/components/DashboardObsCard.vue
+++ b/plugins/obs/renderer/src/components/DashboardObsCard.vue
@@ -5,6 +5,7 @@
 				<i class="obsi obsi-obs" /> {{ obs?.config?.name }}
 				<div class="flex-grow-1" />
 				<p-button
+					v-if="obs.state.connected"
 					icon="mdi mdi-refresh"
 					size="small"
 					class="extra-small-button"
diff --git a/plugins/overlays/main/src/overlay-resource.ts b/plugins/overlays/main/src/overlay-resource.ts
index 9b95b332..e86043cf 100644
--- a/plugins/overlays/main/src/overlay-resource.ts
+++ b/plugins/overlays/main/src/overlay-resource.ts
@@ -14,6 +14,7 @@ import {
 	usePluginLogger,
 } from "castmate-core"
 import {
+	InitialOverlayConfig,
 	IPCOverlayWidgetDescriptor,
 	OverlayConfig,
 	OverlayWidget,
@@ -32,16 +33,16 @@ export class Overlay extends FileResource<OverlayConfig> {
 	static resourceDirectory: string = "./overlays"
 	static storage = new ResourceStorage<Overlay>("Overlay")
 
-	constructor(name?: string) {
+	constructor(initialConfig?: InitialOverlayConfig) {
 		super()
 
-		if (name) {
+		if (initialConfig) {
 			this._id = nanoid()
 		}
 
 		this._config = {
-			name: name ?? "",
-			size: { width: 1920, height: 1080 },
+			name: initialConfig?.name ?? "",
+			size: initialConfig?.size ?? { width: 1920, height: 1080 },
 			widgets: [],
 		}
 	}
diff --git a/plugins/overlays/overlay/src/widgets/Alert.vue b/plugins/overlays/overlay/src/widgets/Alert.vue
index 6cd358c5..c4d54d29 100644
--- a/plugins/overlays/overlay/src/widgets/Alert.vue
+++ b/plugins/overlays/overlay/src/widgets/Alert.vue
@@ -42,12 +42,9 @@ defineOptions({
 		config: {
 			type: Object,
 			properties: {
-				transition: {
-					type: OverlayTransitionAnimation,
-					name: "Transition",
-				},
 				media: {
 					type: Array,
+					name: "Alert Media",
 					items: {
 						type: Object,
 						properties: {
@@ -57,6 +54,10 @@ defineOptions({
 						},
 					},
 				},
+				transition: {
+					type: OverlayTransitionAnimation,
+					name: "Transition",
+				},
 				textBelowMedia: {
 					type: Boolean,
 					name: "Text Below Media",
diff --git a/plugins/overlays/renderer/src/components/OverlayAddToObsButton.vue b/plugins/overlays/renderer/src/components/OverlayAddToObsButton.vue
index b3a0817e..55e322ff 100644
--- a/plugins/overlays/renderer/src/components/OverlayAddToObsButton.vue
+++ b/plugins/overlays/renderer/src/components/OverlayAddToObsButton.vue
@@ -1,6 +1,6 @@
 <template>
 	<div v-if="obsId == null" class="display-box">
-		<div class="p-text-secondary">Connect OBS</div>
+		<div class="p-text-secondary">Select OBS Connection</div>
 	</div>
 	<div v-else-if="!hasObs">
 		<p-button v-if="isLocalObs" @click="openObs"><i class="obsi obsi-obs"></i> Open OBS</p-button>
@@ -16,17 +16,14 @@
 	<div v-else-if="!hasSource">
 		<p-button @click="createSourceClick"><i class="obsi obsi-obs"></i>Create Source</p-button>
 	</div>
-	<div class="display-box" v-else>
-		<i class="mdi mdi-web-box"></i>
-		{{ sourceName }}
-		<p-button
-			v-if="hasError"
-			class="extra-small-button ml-1"
-			size="small"
-			icon="mdi mdi-wrench"
-			v-tooltip="'Fix Issues'"
-			@click="fixErrorsClick"
-		></p-button>
+	<p-button v-else-if="hasError" severity="danger" v-tooltip.top="'OBS Source Needs Fixing'" @click="fixErrorsClick">
+		<i class="mdi mdi-wrench mr-2" /> Fix OBS Source
+	</p-button>
+	<div class="display-box" v-else v-tooltip.top="'This is the OBS Browser Source set to this overlay.'">
+		<span style="box-sizing: border-box">
+			<i class="mdi mdi-web-box"></i>
+			{{ sourceName }}
+		</span>
 	</div>
 </template>
 
@@ -68,7 +65,6 @@ const isLocalObs = computed(() => {
 
 const props = defineProps<{
 	obsId: string | undefined
-	overlayConfig: OverlayConfig
 	overlayId: string
 }>()
 
@@ -83,12 +79,23 @@ const hasObs = computed(() => {
 
 const port = useSettingValue<string>({ plugin: "castmate", setting: "port" })
 
+const overlay = useResource<ResourceData<OverlayConfig>>("Overlay", () => props.overlayId)
+const overlayConfig = computed(() => overlay.value?.config)
+
 onMounted(() => {
 	watch(
-		() => ({ obs: props.obsId, id: props.overlayId, connected: hasObs.value }),
+		() => ({
+			obs: props.obsId,
+			id: props.overlayId,
+			connected: hasObs.value,
+			width: overlayConfig.value?.size?.width,
+			height: overlayConfig.value?.size?.height,
+		}),
 		async () => {
 			try {
-				await findBrowserSource()
+				if (hasObs.value) {
+					await findBrowserSource()
+				}
 			} catch {}
 		},
 		{ immediate: true, deep: true }
@@ -109,6 +116,8 @@ const urlPattern = computed(() => {
 })
 
 async function findBrowserSource() {
+	if (!overlayConfig.value) return
+
 	const source = await findBrowserByUrlPattern(urlPattern.value)
 
 	console.log("Found Potential Source", source)
@@ -121,8 +130,8 @@ async function findBrowserSource() {
 	if (source) {
 		valid =
 			source.inputSettings.url == expectedUrl &&
-			source.inputSettings.width == props.overlayConfig.size.width &&
-			source.inputSettings.height == props.overlayConfig.size.height
+			source.inputSettings.width == overlayConfig.value?.size?.width &&
+			source.inputSettings.height == overlayConfig.value?.size?.height
 	} else {
 		valid = false
 	}
@@ -133,8 +142,8 @@ async function findBrowserSource() {
 async function getBrowserSourceSettings() {
 	return {
 		url: await getOverlayURL(),
-		width: props.overlayConfig.size.width,
-		height: props.overlayConfig.size.height,
+		width: overlayConfig.value?.size?.width ?? 1920,
+		height: overlayConfig.value?.size?.height ?? 1080,
 	}
 }
 
@@ -185,16 +194,16 @@ async function openObs() {
 
 <style scoped>
 .display-box {
-	display: flex;
+	display: inline-flex;
 	flex-direction: row;
 	justify-content: center;
 	align-items: center;
+	vertical-align: bottom;
 
 	border-radius: var(--border-radius);
 	background-color: var(--surface-d);
 
-	padding: 0.5rem;
-
-	margin: 0.5rem;
+	padding: 0.75rem 0.5rem;
+	border: var(--surface-d) solid 1px;
 }
 </style>
diff --git a/plugins/overlays/renderer/src/components/OverlayEditorPage.vue b/plugins/overlays/renderer/src/components/OverlayEditorPage.vue
index 89a97793..3d41ae13 100644
--- a/plugins/overlays/renderer/src/components/OverlayEditorPage.vue
+++ b/plugins/overlays/renderer/src/components/OverlayEditorPage.vue
@@ -2,12 +2,55 @@
 	<div class="overlay-editor">
 		<div class="overlay-editor-header">
 			<div class="pt-4 px-1 flex flex-row w-full justify-content-center gap-1">
+				<div ref="settingsMenuContainer">
+					<p-button icon="mdi mdi-cog" @click="settingsMenuToggle"></p-button>
+				</div>
+				<drop-down-panel
+					v-model="settingsMenuOpen"
+					:container="settingsMenuContainer"
+					:style="{
+						minWidth: '25rem',
+						overflowY: 'auto',
+					}"
+				>
+					<div class="p-1 pt-3 flex flex-column gap-4" @mousedown="stopPropagation">
+						<div class="flex flex-row pt-3 gap-1">
+							<div style="width: 0; flex: 1">
+								<label-floater label="Width" v-slot="labelProps">
+									<p-input-number
+										class="number-fix"
+										v-model="model.size.width"
+										v-bind="labelProps"
+										show-buttons
+										mode="decimal"
+										suffix="px"
+									/>
+								</label-floater>
+							</div>
+							<div style="width: 0; flex: 1">
+								<label-floater label="Height" v-slot="labelProps">
+									<p-input-number
+										class="number-fix"
+										v-model="model.size.height"
+										v-bind="labelProps"
+										show-buttons
+										mode="decimal"
+										suffix="px"
+									/>
+								</label-floater>
+							</div>
+						</div>
+					</div>
+				</drop-down-panel>
 				<div class="flex-grow-1">
 					<data-input
 						:schema="{ type: ResourceProxyFactory, resourceType: 'OBSConnection', name: `OBS Connection` }"
 						v-model="view.obsId"
 					/>
 				</div>
+				<div>
+					<overlay-add-to-obs-button :obsId="view.obsId" :overlay-config="model" :overlay-id="overlayId" />
+				</div>
 				<div ref="previewMenuContainer">
 					<p-button icon="mdi mdi-image-edit" @click="previewMenuToggle" />
 				</div>
@@ -29,9 +72,6 @@
 						v-tooltip="'Open in Browser'"
 					></p-button>
 				</div>
-				<div>
-					<overlay-add-to-obs-button :obsId="view.obsId" :overlay-config="model" :overlay-id="overlayId" />
-				</div>
 			</div>
 		</div>
 		<div class="flex flex-row flex-grow-1">
@@ -67,6 +107,8 @@ import {
 	useDocumentId,
 	useSettingValue,
 	DropDownPanel,
+	LabelFloater,
+	stopPropagation,
 } from "castmate-ui-core"
 import { computed, onMounted, ref, useModel, watch } from "vue"
 import OverlayWidgetPropEdit from "./OverlayWidgetPropEdit.vue"
@@ -77,6 +119,7 @@ import OverlayAddToObsButton from "./OverlayAddToObsButton.vue"
 import PSplitter from "primevue/splitter"
 import PSplitterPanel from "primevue/splitterpanel"
 import PCheckBox from "primevue/checkbox"
+import PInputNumber from "primevue/inputnumber"
 import PButton from "primevue/button"
 import OverlayEditArea from "./OverlayEditArea.vue"
 
@@ -124,6 +167,12 @@ function previewMenuToggle(ev: MouseEvent) {
 	previewMenuOpen.value = !previewMenuOpen.value
 }
 
+const settingsMenuContainer = ref<HTMLElement>()
+const settingsMenuOpen = ref(false)
+function settingsMenuToggle(ev: MouseEvent) {
+	settingsMenuOpen.value = !settingsMenuOpen.value
+}
+
 onMounted(() => {
 	watch(
 		() => props.modelValue.preview,
@@ -153,4 +202,8 @@ onMounted(() => {
 	user-select: none;
 	width: 350px;
 }
+
+.number-fix :deep(.p-inputtext) {
+	width: 100% !important;
+}
 </style>
diff --git a/plugins/overlays/renderer/src/components/OverlayPreviewMenu.vue b/plugins/overlays/renderer/src/components/OverlayPreviewMenu.vue
index 0abb69c8..a287a3c9 100644
--- a/plugins/overlays/renderer/src/components/OverlayPreviewMenu.vue
+++ b/plugins/overlays/renderer/src/components/OverlayPreviewMenu.vue
@@ -13,7 +13,7 @@
 				class="extra-small-button"
 			/>
 		</div>
-		<div class="flex flex-row pt-3 gap-1">
+		<div class="flex flex-row pt-3 gap-1" @mousedown="stopPropagation">
 			<div style="width: 0; flex: 1">
 				<label-floater label="Offset X" v-slot="labelProps">
 					<p-input-number
@@ -46,7 +46,7 @@
 import { OverlayPreviewConfig } from "castmate-plugin-overlays-shared"
 import { computed, useModel } from "vue"
 
-import { LabelFloater, DataInput } from "castmate-ui-core"
+import { LabelFloater, DataInput, stopPropagation } from "castmate-ui-core"
 import PInputNumber from "primevue/inputnumber"
 import PToggleButton from "primevue/togglebutton"
 import { FilePath, declareSchema } from "castmate-schema"
diff --git a/plugins/overlays/renderer/src/components/style/OverlayTextShadowEdit.vue b/plugins/overlays/renderer/src/components/style/OverlayTextShadowEdit.vue
index 29dd3ce5..0364777d 100644
--- a/plugins/overlays/renderer/src/components/style/OverlayTextShadowEdit.vue
+++ b/plugins/overlays/renderer/src/components/style/OverlayTextShadowEdit.vue
@@ -56,7 +56,7 @@
 		</div>
 	</div>
 	<div class="stroke-edit flex flex-row justify-content-center" v-else>
-		<p-button class="flex-grow-1" size="small" icon="mdi mdi-plus" @click="addShadow"> Add Stroke </p-button>
+		<p-button class="flex-grow-1" size="small" icon="mdi mdi-plus" @click="addShadow"> Add Shadow </p-button>
 	</div>
 </template>
 
diff --git a/plugins/overlays/renderer/src/components/style/OverlayTextStrokeEdit.vue b/plugins/overlays/renderer/src/components/style/OverlayTextStrokeEdit.vue
index 955970a9..9d66017e 100644
--- a/plugins/overlays/renderer/src/components/style/OverlayTextStrokeEdit.vue
+++ b/plugins/overlays/renderer/src/components/style/OverlayTextStrokeEdit.vue
@@ -25,7 +25,7 @@
 			</div>
 		</div>
 	</div>
-	<div class="stroke-edit flex flex-row justify-content-center" v-else>
+	<div class="flex flex-row justify-content-center mb-2 mt-2" v-else>
 		<p-button class="flex-grow-1" size="small" icon="mdi mdi-plus" @click="addStroke"> Add Stroke </p-button>
 	</div>
 </template>
diff --git a/plugins/overlays/renderer/src/main.ts b/plugins/overlays/renderer/src/main.ts
index e2ebfb4e..1cadf9da 100644
--- a/plugins/overlays/renderer/src/main.ts
+++ b/plugins/overlays/renderer/src/main.ts
@@ -1,6 +1,7 @@
 import { computed, App } from "vue"
 import {
 	ProjectGroup,
+	ResourceSchemaEdit,
 	getResourceAsProjectGroup,
 	handleIpcMessage,
 	handleIpcRpc,
@@ -67,11 +68,31 @@ export function initPlugin(app: App<Element>) {
 					},
 				},
 				obsId: undefined,
-				showPreview: false,
 			}
 		},
 	})
 
+	resourceStore.registerConfigSchema("Overlay", {
+		type: Object,
+		properties: {
+			name: { type: String, name: "Overlay Name", required: true, default: "Overlay" },
+			size: {
+				name: "Size",
+				type: Object,
+				properties: {
+					width: { type: Number, required: true, name: "Width", default: 1920 },
+					height: { type: Number, required: true, name: "Height", default: 1080 },
+				},
+			},
+		},
+	})
+
+	resourceStore.registerEditComponent("Overlay", ResourceSchemaEdit, async (id, data: any) => {
+		await resourceStore.applyResourceConfig("Overlay", id, data)
+	})
+
+	resourceStore.registerCreateComponent("Overlay", ResourceSchemaEdit)
+
 	projectStore.registerProjectGroupItem(overlayGroup)
 
 	configStore.initialize()
diff --git a/plugins/overlays/shared/src/overlay-resource-types.ts b/plugins/overlays/shared/src/overlay-resource-types.ts
index 9fb2cdeb..26fecc3e 100644
--- a/plugins/overlays/shared/src/overlay-resource-types.ts
+++ b/plugins/overlays/shared/src/overlay-resource-types.ts
@@ -28,6 +28,11 @@ export interface OverlayPreviewConfig {
 	source?: string | "obs"
 }
 
+export interface InitialOverlayConfig {
+	name: string
+	size: { width: number; height: number }
+}
+
 export interface OverlayConfig {
 	name: string
 	size: { width: number; height: number }
diff --git a/plugins/philips-hue/main/src/discovery.ts b/plugins/philips-hue/main/src/discovery.ts
index 1ddf2d02..f5dd0af6 100644
--- a/plugins/philips-hue/main/src/discovery.ts
+++ b/plugins/philips-hue/main/src/discovery.ts
@@ -14,32 +14,59 @@ import os from "os"
 
 const logger = usePluginLogger("philips-hue")
 
+async function validateHubIP(hubIp: string | undefined) {
+	try {
+		if (!hubIp) return false
+
+		const resp = await coreAxios.get(`http://${hubIp}/api/0/config`)
+
+		return "name" in resp.data && "bridgeid" in resp.data
+	} catch (err) {
+		logger.error(`Error Querying Possible Hub ${hubIp}`, err)
+		return false
+	}
+}
+
 export function setupDiscovery(hubIp: ReactiveRef<string | undefined>, hubKey: ReactiveRef<string | undefined>) {
 	async function discoverBridge() {
-		const resp = await coreAxios.get("https://discovery.meethue.com/")
+		try {
+			const resp = await coreAxios.get("https://discovery.meethue.com/")
 
-		if (!Array.isArray(resp.data) || resp.data.length == 0) {
-			return
-		}
+			if (!Array.isArray(resp.data) || resp.data.length == 0) {
+				return
+			}
 
-		hubIp.value = resp.data[0]?.internalipaddress
+			for (const possibleHub of resp.data) {
+				if (await validateHubIP(possibleHub?.internalipaddress)) {
+					hubIp.value = possibleHub?.internalipaddress
+					return
+				}
+			}
+		} catch (err) {
+			logger.error("Error trying to discover bridge ip", err)
+		}
 	}
 
 	async function tryCreateKey() {
 		if (!hubIp.value) return
 
-		const resp = await coreAxios.post(`http://${hubIp.value}/api`, {
-			devicetype: `CastMate#${os.userInfo().username}`,
-		})
+		try {
+			const resp = await coreAxios.post(`http://${hubIp.value}/api`, {
+				devicetype: `CastMate#${os.userInfo().username}`,
+			})
 
-		const key = resp.data[0]?.success?.username as string | undefined
+			const key = resp.data[0]?.success?.username as string | undefined
 
-		if (key) {
-			logger.log("Key Found", key)
-			hubKey.value = key
-		}
+			if (key) {
+				logger.log("Key Found", key)
+				hubKey.value = key
+			}
 
-		return key
+			return key
+		} catch (err) {
+			logger.error("Error Creating HUE Key", err)
+			return undefined
+		}
 	}
 
 	defineRendererCallable("findHueBridge", async () => {
diff --git a/plugins/twitch/main/src/channelpoints.ts b/plugins/twitch/main/src/channelpoints.ts
index bbda4357..1e4a93c0 100644
--- a/plugins/twitch/main/src/channelpoints.ts
+++ b/plugins/twitch/main/src/channelpoints.ts
@@ -7,6 +7,7 @@ import {
 	onLoad,
 	onProfilesChanged,
 	runOnChange,
+	startPerfTime,
 	template,
 	templateSchema,
 	usePluginLogger,
@@ -444,50 +445,55 @@ export function setupChannelPointRewards() {
 	}
 
 	async function loadRewards() {
-		const channelAccount = TwitchAccount.channel
+		const perf = startPerfTime(`Load Rewards`)
+		try {
+			const channelAccount = TwitchAccount.channel
 
-		if (!channelAccount.config.isAffiliate) {
-			logger.log("Not Affiliate Skipping Rewards")
-			return
-		}
+			if (!channelAccount.config.isAffiliate) {
+				logger.log("Not Affiliate Skipping Rewards")
+				return
+			}
 
-		const channelId = channelAccount.config.twitchId
+			const channelId = channelAccount.config.twitchId
 
-		await clearNonCastMateRewards()
+			await clearNonCastMateRewards()
 
-		//Unforunately there's no way to query for rewards not controlled by this client id
-		//We can only query for all rewards and rewards we control
-		//Query both.
-		const rewards = await channelAccount.apiClient.channelPoints.getCustomRewards(channelId)
-		const castMateRewards = await channelAccount.apiClient.channelPoints.getCustomRewards(channelId, true)
+			//Unforunately there's no way to query for rewards not controlled by this client id
+			//We can only query for all rewards and rewards we control
+			//Query both.
+			const rewards = await channelAccount.apiClient.channelPoints.getCustomRewards(channelId)
+			const castMateRewards = await channelAccount.apiClient.channelPoints.getCustomRewards(channelId, true)
 
-		//Filter for non-castmate controllable rewards
-		const nonCastMateRewards = rewards.filter((r) => castMateRewards.find((o) => o.id == r.id) == null)
+			//Filter for non-castmate controllable rewards
+			const nonCastMateRewards = rewards.filter((r) => castMateRewards.find((o) => o.id == r.id) == null)
 
-		//Load all the non-castmate rewards into resources
-		await Promise.all(nonCastMateRewards.map((r) => ChannelPointReward.createNonCastmateReward(r)))
+			//Load all the non-castmate rewards into resources
+			await Promise.all(nonCastMateRewards.map((r) => ChannelPointReward.createNonCastmateReward(r)))
 
-		for (const reward of castMateRewards) {
-			const cpr = ChannelPointReward.getByTwitchId(reward.id)
+			for (const reward of castMateRewards) {
+				const cpr = ChannelPointReward.getByTwitchId(reward.id)
 
-			//This reward is controllable but doesn't have a locally stored resource, create it now
-			if (!cpr) {
-				await ChannelPointReward.recoverLocalReward(reward)
-				//Add this to the reward list so we handle it properly in the next step
+				//This reward is controllable but doesn't have a locally stored resource, create it now
+				if (!cpr) {
+					await ChannelPointReward.recoverLocalReward(reward)
+					//Add this to the reward list so we handle it properly in the next step
+				}
 			}
-		}
 
-		for (const reward of ChannelPointReward.storage) {
-			if (!reward.config.controllable) continue
+			for (const reward of ChannelPointReward.storage) {
+				if (!reward.config.controllable) continue
 
-			const twitchReward = castMateRewards.find((r) => r.id == reward.config.twitchId)
+				const twitchReward = castMateRewards.find((r) => r.id == reward.config.twitchId)
 
-			try {
-				await reward.initializeFromTwurple(twitchReward)
-				await reward.initializeReactivity()
-			} catch (err) {
-				logger.error("Error Initializing Reward", reward.config.name, err)
+				try {
+					await reward.initializeFromTwurple(twitchReward)
+					await reward.initializeReactivity()
+				} catch (err) {
+					logger.error("Error Initializing Reward", reward.config.name, err)
+				}
 			}
+		} finally {
+			perf.stop(logger)
 		}
 	}
 
diff --git a/plugins/twitch/main/src/chat.ts b/plugins/twitch/main/src/chat.ts
index 5643e416..a233b90b 100644
--- a/plugins/twitch/main/src/chat.ts
+++ b/plugins/twitch/main/src/chat.ts
@@ -125,6 +125,10 @@ export function setupChat() {
 
 			if (matchResult == null) return undefined
 
+			if (!(await inTwitchViewerGroup(context.viewer, config.group))) {
+				return undefined
+			}
+
 			if (config.cooldown) {
 				const now = Date.now()
 				const slug = `${mapping.profileId}.${mapping.triggerId}`
@@ -137,10 +141,6 @@ export function setupChat() {
 				chatCommandCooldownMap.set(slug, now)
 			}
 
-			if (!(await inTwitchViewerGroup(context.viewer, config.group))) {
-				return undefined
-			}
-
 			return {
 				...context,
 				...matchResult,
diff --git a/plugins/twitch/main/src/follows.ts b/plugins/twitch/main/src/follows.ts
index 8f94e5bf..f382dc77 100644
--- a/plugins/twitch/main/src/follows.ts
+++ b/plugins/twitch/main/src/follows.ts
@@ -1,4 +1,4 @@
-import { defineState, defineTrigger } from "castmate-core"
+import { defineState, defineTrigger, startPerfTime, usePluginLogger } from "castmate-core"
 import { onChannelAuth } from "./api-harness"
 import { ViewerCache } from "./viewer-cache"
 import { TwitchViewer, TwitchViewerGroup } from "castmate-plugin-twitch-shared"
@@ -6,6 +6,8 @@ import { inTwitchViewerGroup } from "./group"
 import { TwitchAccount } from "./twitch-auth"
 
 export function setupFollows() {
+	const logger = usePluginLogger()
+
 	const follow = defineTrigger({
 		id: "follow",
 		name: "Followed",
@@ -44,6 +46,8 @@ export function setupFollows() {
 	})
 
 	async function updateFollowCount() {
+		const perf = startPerfTime(`Follow Count Update`)
+
 		const followersResp = await TwitchAccount.channel.apiClient.channels.getChannelFollowers(
 			TwitchAccount.channel.twitchId
 		)
@@ -52,6 +56,8 @@ export function setupFollows() {
 		followers.value = followersResp.total
 
 		lastFollower.value = await ViewerCache.getInstance().getResolvedViewer(followersResp.data[0].userId)
+
+		perf.stop(logger)
 	}
 
 	onChannelAuth(async (account, service) => {
diff --git a/plugins/twitch/main/src/hype-train.ts b/plugins/twitch/main/src/hype-train.ts
index 3e3a13de..841b5e5c 100644
--- a/plugins/twitch/main/src/hype-train.ts
+++ b/plugins/twitch/main/src/hype-train.ts
@@ -1,8 +1,10 @@
-import { defineState, defineTrigger } from "castmate-core"
+import { defineState, defineTrigger, startPerfTime, usePluginLogger } from "castmate-core"
 import { Range } from "castmate-schema"
 import { onChannelAuth } from "./api-harness"
 
 export function setupHypeTrains() {
+	const logger = usePluginLogger()
+
 	const hypeTrainStarted = defineTrigger({
 		id: "hypeTrainStarted",
 		name: "Hype Train Started",
@@ -118,6 +120,8 @@ export function setupHypeTrains() {
 	})
 
 	onChannelAuth(async (channel, service) => {
+		const perf = startPerfTime(`HypeTrains`)
+
 		service.eventsub.onChannelHypeTrainBegin(channel.twitchId, (event) => {
 			hypeTrainLevel.value = event.level
 			hypeTrainProgress.value = event.progress
@@ -183,5 +187,7 @@ export function setupHypeTrains() {
 				hypeTrainExists.value = true
 			}
 		}
+
+		perf.stop(logger)
 	})
 }
diff --git a/plugins/twitch/main/src/viewer-cache.ts b/plugins/twitch/main/src/viewer-cache.ts
index a423ee53..018b9904 100644
--- a/plugins/twitch/main/src/viewer-cache.ts
+++ b/plugins/twitch/main/src/viewer-cache.ts
@@ -56,14 +56,12 @@ function getNValues<T>(set: Set<T>, requiredValues: T[], n: number): T[] {
 		return result
 	}
 
-	let count = 0
 	for (const v of set) {
 		if (requiredValues.includes(v)) {
 			continue
 		}
 		result.push(v)
-		count++
-		if (count >= n) {
+		if (result.length >= n) {
 			break
 		}
 	}
@@ -269,17 +267,27 @@ export const ViewerCache = Service(
 		}
 
 		private async queryColor(...userIds: string[]) {
+			const perf1 = startPerfTime("Query Color User Gather")
 			const ids = getNValues(this.unknownColors, userIds, 100)
+			perf1.stop(logger)
+
 			try {
+				const perf2 = startPerfTime(`Run Query Color ${ids.length}`)
 				const colors = await TwitchAccount.channel.apiClient.chat.getColorsForUsers(ids)
+				perf2.stop(logger)
 
+				const perf3 = startPerfTime("Update Colors")
 				for (const [id, color] of colors) {
 					//TODO: Default color for the unchosen
 					this.get(id).color = (color as Color) ?? "default"
 				}
 
 				removeValues(this.unknownColors, ids)
-			} catch (err) {}
+				perf3.stop(logger)
+			} catch (err) {
+				logger.error("Error Querying Colors!", err)
+				logger.error("IDS", ids)
+			}
 		}
 
 		async getChatColor(userId: string): Promise<Color | "default"> {
@@ -385,12 +393,17 @@ export const ViewerCache = Service(
 			try {
 				userIds = userIds.filter((id) => id != "anonymous")
 
+				const perf1 = startPerfTime("Running Follow Queries")
+
 				//Annoyingly check each follow independently
 				const followingPromises = userIds.map((id) =>
 					TwitchAccount.channel.apiClient.channels.getChannelFollowers(TwitchAccount.channel.twitchId, id)
 				)
 
 				const followingResults = await Promise.all(followingPromises)
+				perf1.stop(logger)
+
+				const perf2 = startPerfTime("Updating Follows")
 
 				for (let i = 0; i < userIds.length; ++i) {
 					const cached = this.get(userIds[i])
@@ -407,7 +420,11 @@ export const ViewerCache = Service(
 					cached.following = true
 					//cached.followDate = following.data[0].followDate
 				}
-			} catch (err) {}
+				perf2.stop(logger)
+			} catch (err) {
+				logger.error("Error Querying Follows", err)
+				logger.error("IDS", userIds)
+			}
 		}
 
 		async getIsFollowing(userId: string): Promise<boolean> {
@@ -443,14 +460,19 @@ export const ViewerCache = Service(
 		}
 
 		private async querySubInfo(...userIds: string[]) {
+			const perf1 = startPerfTime("Query Subs Gather Users")
 			const ids = getNValues(this.unknownSubInfo, userIds, 100)
+			perf1.stop(logger)
 
 			try {
+				const perf2 = startPerfTime(`Run Query Subs ${ids.length}`)
 				const subs = await TwitchAccount.channel.apiClient.subscriptions.getSubscriptionsForUsers(
 					TwitchAccount.channel.twitchId,
 					ids
 				)
+				perf2.stop(logger)
 
+				const perf3 = startPerfTime("Update Subs")
 				const leftOvers = new Set(ids)
 
 				for (const sub of subs) {
@@ -473,7 +495,11 @@ export const ViewerCache = Service(
 				}
 
 				removeValues(this.unknownSubInfo, ids)
-			} catch (err) {}
+				perf3.stop(logger)
+			} catch (err) {
+				logger.error("Error Querying Subs!", err)
+				logger.error("IDS", ids)
+			}
 		}
 
 		async getIsSubbed(userId: string) {
@@ -499,10 +525,15 @@ export const ViewerCache = Service(
 		}
 
 		private async queryUserInfo(...userIds: string[]) {
+			const perf1 = startPerfTime("Query User Gather")
 			const ids = getNValues(this.unknownUserInfo, userIds, 100)
+			perf1.stop(logger)
 			try {
+				const perf2 = startPerfTime(`Run Get Users Query ${ids.length}`)
 				const users = await TwitchAccount.channel.apiClient.users.getUsersByIds(ids)
+				perf2.stop(logger)
 
+				const perf3 = startPerfTime(`Update User Info`)
 				for (const user of users) {
 					const cached = this.getOrCreate(user.id)
 
@@ -513,7 +544,11 @@ export const ViewerCache = Service(
 
 					this.unknownUserInfo.delete(user.id)
 				}
-			} catch (err) {}
+				perf3.stop(logger)
+			} catch (err) {
+				logger.error("Error Updating Users!", err)
+				logger.error("IDS", ids)
+			}
 		}
 
 		async getResolvedViewer(userId: string) {
@@ -521,7 +556,7 @@ export const ViewerCache = Service(
 		}
 
 		async getResolvedViewers(userIds: string[]): Promise<TwitchViewer[]> {
-			const perf = startPerfTime("Resolve Viewer")
+			const perf = startPerfTime(`Resolve Viewers ${userIds.length}`)
 			try {
 				const neededSubIds: string[] = []
 				const neededColorIds: string[] = []
@@ -554,18 +589,22 @@ export const ViewerCache = Service(
 				const queryPromises: Promise<any>[] = []
 
 				if (neededColorIds.length > 0) {
+					logger.log("---Querying Colors:", neededColorIds.length)
 					queryPromises.push(this.queryColor(...neededColorIds))
 				}
 
 				if (neededFollowerIds.length > 0) {
+					logger.log("---Querying Following:", neededFollowerIds.length)
 					queryPromises.push(this.queryFollowing(...neededFollowerIds))
 				}
 
 				if (neededSubIds.length > 0) {
+					logger.log("---Querying Subs:", neededSubIds.length)
 					queryPromises.push(this.querySubInfo(...neededSubIds))
 				}
 
 				if (neededUserInfoIds.length > 0) {
+					logger.log("---Query User Infos:", neededUserInfoIds.length)
 					queryPromises.push(this.queryUserInfo(...neededUserInfoIds))
 				}
 
diff --git a/plugins/twitch/renderer/src/components/channel-points/ChannelPointsEditPage.vue b/plugins/twitch/renderer/src/components/channel-points/ChannelPointsEditPage.vue
index e17b4ec8..6e2ce89f 100644
--- a/plugins/twitch/renderer/src/components/channel-points/ChannelPointsEditPage.vue
+++ b/plugins/twitch/renderer/src/components/channel-points/ChannelPointsEditPage.vue
@@ -13,25 +13,26 @@
 				sort-field="config.controllable"
 				:sort-order="-1"
 			>
-				<!-- <template #header>
+				<template #header>
 					<div class="flex justify-content-end">
-						<span class="p-input-icon-left">
+						<!--<span class="p-input-icon-left">
 							<i class="pi pi-search" />
 							<p-input-text v-model="filters['global'].value" placeholder="Search" />
-						</span>
+						</span>-->
+						<p-button @click="createDialog()"> Create CastMate Reward</p-button>
 					</div>
-				</template> -->
+				</template>
+				<!--<template #empty> ... </template> -->
 				<template #groupheader="{ data }">
-					<div>
-						<template v-if="(data as ChannelPointResource).config.controllable">
+					<!--template v-if="(data as ChannelPointResource).config.controllable">
 							<div class="flex flex-row">
 								<div class="flex-1">
 									<h3 class="my-0">CastMate Channel Point Rewards</h3>
 								</div>
-								<p-button @click="createDialog()"> Create Reward</p-button>
 							</div>
-						</template>
-						<template v-else>
+						</template-->
+					<template v-if="!(data as ChannelPointResource).config.controllable">
+						<div>
 							<div class="flex flex-row">
 								<div class="flex-1">
 									<h3 class="my-0">Other Channel Point Rewards</h3>
@@ -48,8 +49,8 @@
 									Open Dashboard
 								</a>
 							</div>
-						</template>
-					</div>
+						</div>
+					</template>
 				</template>
 				<!-- Required because groupby assumes there's a column that it's grouping by -->
 				<p-column field="config.controllable"> </p-column>
diff --git a/yarn.lock b/yarn.lock
index 98e4c189..8284a692 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3305,7 +3305,7 @@ __metadata:
     castmate-schema: "workspace:^"
     jsqr: "npm:^1.4.0"
     node-screenshots: "npm:^0.2.0"
-    obs-websocket-js: "npm:^5.0.5"
+    obs-websocket-js: "npm:^5.0.6"
     regedit: "npm:^5.1.3"
     typescript: "npm:*"
   languageName: unknown
@@ -7828,9 +7828,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"obs-websocket-js@npm:^5.0.5":
-  version: 5.0.5
-  resolution: "obs-websocket-js@npm:5.0.5"
+"obs-websocket-js@npm:^5.0.6":
+  version: 5.0.6
+  resolution: "obs-websocket-js@npm:5.0.6"
   dependencies:
     "@msgpack/msgpack": "npm:^2.7.1"
     crypto-js: "npm:^4.1.1"
@@ -7839,7 +7839,7 @@ __metadata:
     isomorphic-ws: "npm:^5.0.0"
     type-fest: "npm:^3.11.0"
     ws: "npm:^8.13.0"
-  checksum: 10/10075f057e05cddf0805b3edad9263f6c6da31c817a4cba27a2e6fd6fef20df188db0bcc929bbdd48bd6542b19f5c6e08e0acbdc062065ca7e571addd91a4601
+  checksum: 10/a48a6df46c6673b374444443cb0eb3ec14b7a1928c3c33459181a9697f93b470c72349a8619518785dcde4c5f2f2287404e086c522519a61ff3e00727c0a5d3f
   languageName: node
   linkType: hard