fix: corrected handling and resolution of theme colors for tab instead of using the hardcoded items

src/components/TabSystem/TabSystem.vue

@@ -55,6 +55,13 @@ const contextMenu: Ref<typeof FreeContextMenu | null> = ref(null)
 const contextMenuTab: ShallowRef<Tab | null> = shallowRef(null)
 const contextMenuTabActions: Ref<string[]> = ref([])
 
+function tabColor(tab: Tab): string {
+	if (!(tab instanceof FileTab)) return 'text'
+	if (!(ProjectManager.currentProject instanceof BedrockProject)) return 'text'
+
+	return ProjectManager.currentProject.getPackFromPath(tab.path)?.color ?? 'text'
+}
+
 function getTabFromTarget(target: HTMLElement): HTMLElement | null {
 	if (target.dataset.tab === 'tab') return target
 
@@ -204,16 +211,17 @@ function dragEnd(event: DragEvent) {
 					<div class="relative">
 						<div
 							v-if="tab instanceof FileTab && tab.modified.value"
-							class="bg-behaviorPack border-2 border-[var(--border-color)] w-3 h-3 rounded-full absolute right-[-0.25rem] top-1"
+							class="border-2 border-[var(--border-color)] w-3 h-3 rounded-full absolute right-[-0.25rem] top-1"
 							:style="{
+								backgroundColor: `var(--theme-color-${tabColor(tab)})`,
 								'--border-color':
 									instance.selectedTab.value == tab
 										? 'var(--theme-color-backgroundSecondary)'
 										: 'var(--theme-color-background)',
 							}"
 						></div>
 
-						<Icon v-if="tab.icon" :icon="tab.icon.value ?? 'help'" class="text-base text-behaviorPack" />
+						<Icon v-if="tab.icon" :icon="tab.icon.value ?? 'help'" :color="tabColor(tab)" class="text-base" />
 					</div>
 
 					<p

src/libs/project/BedrockProject.ts

@@ -82,4 +82,23 @@ export class BedrockProject extends Project {
 	public async build() {
 		await this.dashService.build()
 	}
+
+	/**
+	 * Resolves the pack a file path belongs to. Uses the longest matching pack root so nested packs resolve correctly.
+	 */
+	public getPackFromPath(path: string): IPackType | null {
+		let bestPackId: string | null = null
+		let bestLength = -1
+
+		for (const [packId, packPath] of Object.entries(this.packs)) {
+			if ((path === packPath || path.startsWith(packPath + '/')) && packPath.length > bestLength) {
+				bestPackId = packId
+				bestLength = packPath.length
+			}
+		}
+
+		if (bestPackId === null) return null
+
+		return this.packDefinitions.find((packDefinition) => packDefinition.id === bestPackId) ?? null
+	}
 }