From 835168179ed0d806b84564bafebb76198192ed5a Mon Sep 17 00:00:00 2001
From: FragginWagon <greg.r.jacobs@gmail.com>
Date: Thu, 29 Jan 2026 04:27:51 +0000
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Enhance=20reactivity=20and=20null?=
 =?UTF-8?q?=20safety=20in=20file=20state=20management=20with=20computed=20?=
 =?UTF-8?q?properties=20and=20conditional=20checks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/gamemaster/FileSelector.vue    | 37 ++++++++++++-------
 1 file changed, 23 insertions(+), 14 deletions(-)

diff --git a/code/websites/pokedex.online/src/components/gamemaster/FileSelector.vue b/code/websites/pokedex.online/src/components/gamemaster/FileSelector.vue
index 0882ef1..0436235 100644
--- a/code/websites/pokedex.online/src/components/gamemaster/FileSelector.vue
+++ b/code/websites/pokedex.online/src/components/gamemaster/FileSelector.vue
@@ -43,30 +43,39 @@ const props = defineProps({
   }
 });
 
-const internalFilesState = useGamemasterFiles(props.client);
+const internalFilesState = props.client ? useGamemasterFiles(props.client) : null;
 const activeFilesState = computed(() => props.filesState || internalFilesState);
 
-const selectedFile = computed(() => activeFilesState.value.selectedFile);
-const fileContent = computed(() => activeFilesState.value.fileContent);
-const fileLines = computed(() => activeFilesState.value.fileLines);
-const uniqueFiles = computed(() => activeFilesState.value.uniqueFiles);
-const isLoading = computed(() => activeFilesState.value.isLoading);
-const fileError = computed(() => activeFilesState.value.fileError);
+const selectedFile = computed({
+  get: () => activeFilesState.value?.selectedFile?.value,
+  set: (val) => { 
+    if (activeFilesState.value?.selectedFile) {
+      activeFilesState.value.selectedFile.value = val;
+    }
+  }
+});
+const fileContent = computed(() => activeFilesState.value?.fileContent?.value);
+const fileLines = computed(() => activeFilesState.value?.fileLines?.value || []);
+const uniqueFiles = computed(() => activeFilesState.value?.uniqueFiles?.value || []);
+const isLoading = computed(() => activeFilesState.value?.isLoading?.value || false);
+const fileError = computed(() => activeFilesState.value?.fileError?.value);
 
-const formatSize = (...args) => activeFilesState.value.formatSize(...args);
+const formatSize = (...args) => activeFilesState.value?.formatSize?.(...args);
 const formatFileName = (...args) =>
-  activeFilesState.value.formatFileName(...args);
-const getFileType = (...args) => activeFilesState.value.getFileType(...args);
+  activeFilesState.value?.formatFileName?.(...args);
+const getFileType = (...args) => activeFilesState.value?.getFileType?.(...args);
 
 const selectedFileMeta = computed(() => {
-  if (!selectedFile.value.value) return null;
-  return uniqueFiles.value.value.find(
-    file => getFileType(file.filename) === selectedFile.value.value
+  if (!selectedFile.value) return null;
+  return uniqueFiles.value.find(
+    file => getFileType(file.filename) === selectedFile.value
   );
 });
 
 onMounted(() => {
-  activeFilesState.value.loadStatus();
+  if (activeFilesState.value?.loadStatus) {
+    activeFilesState.value.loadStatus();
+  }
 });
 </script>