From 0d1f23609601f3c9aeab9268b9002a23a5bc6007 Mon Sep 17 00:00:00 2001
From: Sean Sube <seansube@gmail.com>
Date: Sat, 21 Jan 2023 22:50:12 -0600
Subject: [PATCH] fix(gui): populate empty select menus with first valid value

---
 gui/src/components/input/QueryList.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/gui/src/components/input/QueryList.tsx b/gui/src/components/input/QueryList.tsx
index 949b176e..f4f75035 100644
--- a/gui/src/components/input/QueryList.tsx
+++ b/gui/src/components/input/QueryList.tsx
@@ -40,6 +40,14 @@ export function QueryList<T>(props: QueryListProps<T>) {
   const { labels, query, value } = props;
   const { result } = query;
 
+  function firstValidValue(): string {
+    if (doesExist(value) && data.includes(value)) {
+      return value;
+    } else {
+      return data[0];
+    }
+  }
+
   if (result.status === 'error') {
     if (result.error instanceof Error) {
       return <Alert severity='error'>Error: {result.error.message}</Alert>;
@@ -65,7 +73,7 @@ export function QueryList<T>(props: QueryListProps<T>) {
     <Select
       labelId={labelID}
       label={props.name}
-      value={value}
+      value={firstValidValue()}
       onChange={(e) => {
         if (doesExist(props.onChange)) {
           props.onChange(e.target.value);