diff --git a/react-openapi/hooks/useResource.ts b/react-openapi/hooks/useResource.ts
index 9dae5e6..58b034e 100644
--- a/react-openapi/hooks/useResource.ts
+++ b/react-openapi/hooks/useResource.ts
@@ -10,12 +10,12 @@ import GenericForm from "../components/GenericForm";
 
 function wrapFormField(merged: FieldComponents) {
   return (props: Omit<React.ComponentProps<typeof FormField>, 'components'>) =>
-    <FormField {...props} components={merged} />;
+    React.createElement(FormField, { ...props, components: merged });
 }
 
 function wrapGenericForm(merged: FieldComponents) {
   return (props: Omit<React.ComponentProps<typeof GenericForm>, 'fieldComponents'>) =>
-    <GenericForm {...props} fieldComponents={merged} />;
+    React.createElement(GenericForm, { ...props, fieldComponents: merged });
 }
 
 export function useResource<T = any>(config: ResourceConfig | undefined, options?: { fieldComponents: FieldComponents }) {
diff --git a/react-openapi/utils/openapi_loader.ts b/react-openapi/utils/openapi_loader.ts
index 355c5f6..069ca1b 100644
--- a/react-openapi/utils/openapi_loader.ts
+++ b/react-openapi/utils/openapi_loader.ts
@@ -76,6 +76,12 @@ function parseSchemaFields(
     }
 
     const type = mapOpenApiType(resolvedProp);
+    if (type === 'enum' && (!resolvedProp.enum || resolvedProp.enum.length === 0)) {
+      throw new Error(
+        `OpenAPI schema error: field "${resourceName}.${key}" is type "enum" but has no enum values. ` +
+        `Add an "enum" array with at least one value to the OpenAPI schema definition.`
+      );
+    }
     const override = overrides[key];
 
     // Explicitly skip 'id' as it's the primary key and handled elsewhere
diff --git a/src/FetchRequests.tsx b/src/FetchRequests.tsx
index 2c6f006..cbbbada 100644
--- a/src/FetchRequests.tsx
+++ b/src/FetchRequests.tsx
@@ -122,8 +122,8 @@ export default function FetchRequests() {
 
   const config = useConfig();
   const fetchRes = config?.resources.find((r: any) => r.name === "fetch-requests");
-  const formatField: ResourceField | undefined = fetchRes?.fields?.source?.schema?.fields?.format;
-  const formatOptions: string[] = formatField?.options ?? formatField?.schema?.options as string[] ?? [];
+  const formatField: ResourceField | undefined = fetchRes?.fields?.source?.schema?.format;
+  const formatOptions: string[] = formatField?.options ?? [];
   const startDateField: ResourceField | undefined = fetchRes?.fields?.start_date;
   const endDateField: ResourceField | undefined = fetchRes?.fields?.end_date;
   const payorUsernameField: ResourceField | undefined = fetchRes?.fields?.payor_username;
@@ -396,12 +396,14 @@ export default function FetchRequests() {
               ))}
             </Select>
           </FormControl>
-          <TextField
-            label="Account"
-            value={accountFilter}
-            onChange={(e) => setAccountFilter(e.target.value)}
-            size="small"
-            sx={{ minWidth: 160 }}
+          <Autocomplete
+            options={accountOptions}
+            value={accountFilter || null}
+            onChange={(_, val) => setAccountFilter(val ?? "")}
+            renderInput={(params) => (
+              <TextField {...params} label="Account" size="small" sx={{ minWidth: 160 }} />
+            )}
+            sx={{ minWidth: 160, "& .MuiOutlinedInput-root": { height: "auto", minHeight: "2.5rem" } }}
           />
           <ToggleButtonGroup
             value={sourceFilter}