payee display fixes

react-openapi/src/context/useResource.tsx

@@ -266,16 +266,7 @@ function buildFilterComponent(field: FieldConfig, resourceName: string): React.F
     );
   }
 
-  if (
+  function buildAutocompleteFilter(getDisplayValue: (row: any) => string) {
-    !field.fk &&
-    !field.enumValues &&
-    field.type !== "boolean" &&
-    field.type !== "integer" &&
-    field.type !== "number" &&
-    field.format !== "date" &&
-    field.format !== "date-time" &&
-    !field.refSchema
-  ) {
     const StringAutocompleteFilter: React.FC<FilterComponentProps> = ({ value, onChange, data, labelOverride }) => {
       const { resources, config } = useAppContext();
       const filterMode = config.resourceConfig?.[resourceName]?.filterOptions?.mode ?? "server";
@@ -284,7 +275,12 @@ function buildFilterComponent(field: FieldConfig, resourceName: string): React.F
 
       useEffect(() => {
         if (filterMode === "client" && data) {
-          setOptions(extractDataOptions(data, field.name));
+          const vals = new Set<string>();
+          for (const row of data) {
+            const v = getDisplayValue(row);
+            if (v && v !== "") vals.add(v);
+          }
+          setOptions([...vals].sort());
           fetched.current = true;
         } else if (filterMode === "server" && !fetched.current) {
           const cacheKey = resourceName + ":" + field.name;
@@ -302,11 +298,11 @@ function buildFilterComponent(field: FieldConfig, resourceName: string): React.F
                 const res = await api.get(selfRes.path, { params });
                 let items: any[];
                 if (selfRes.pagination) {
-                  items = res.data.items ?? [];
+                  items = Array.isArray(res.data) ? res.data : (res.data.items ?? []);
                 } else {
                   items = Array.isArray(res.data) ? res.data : [];
                 }
-                const values = [...new Set(items.map((r: any) => String(r[field.name] ?? "")).filter(Boolean))].sort();
+                const values = [...new Set(items.map((r: any) => getDisplayValue(r)).filter(Boolean))].sort();
                 _stringOptionsCache.set(cacheKey, values);
                 setOptions(values);
                 fetched.current = true;
@@ -338,6 +334,23 @@ function buildFilterComponent(field: FieldConfig, resourceName: string): React.F
     return StringAutocompleteFilter;
   }
 
+  const isSimpleField =
+    !field.fk && !field.enumValues &&
+    field.type !== "boolean" && field.type !== "integer" && field.type !== "number" &&
+    field.format !== "date" && field.format !== "date-time";
+
+  if (isSimpleField && !field.refSchema) {
+    return buildAutocompleteFilter((row) => String(row[field.name] ?? ""));
+  }
+
+  if (field.refSchema && field.inlineDisplayFormat) {
+    return buildAutocompleteFilter((row) => {
+      const val = row[field.name];
+      if (val == null || typeof val !== "object") return "";
+      return field.inlineDisplayFormat!.replace(/\{(\w+)\}/g, (_, key) => String(val[key] ?? ""));
+    });
+  }
+
   return ({ value, onChange, labelOverride }) => (
     <StringField
       field={{ ...field, readOnly: false, description: "", label: labelOverride ?? field.label }}