openapi-spec-reader (#10)
### Summary of Changes:
1. **Spec-Driven Enums**:
- Updated `openapi_loader.ts` to collect all standalone enum schemas (e.g., `FetchRequestStatus`) into the `AppConfig.enums` map.
- Implemented `mergeProperties` and `oneOf`/`anyOf` resolution in `openapi_loader.ts` to ensure complex schemas like `FetchRequest` (using `allOf`) and `source` (using `oneOf`) are correctly parsed.
2. **Customizable Labeling**:
- Added `enumOption` (template-based) and `enumLabels` (mapping-based) to the config and field types.
- Implemented `resolveTemplate` in `utils/options.ts` to handle placeholders like `'{name} {number}'` or plain field names.
3. **UI Integration**:
- **`FormField.tsx`**: Updated relation and enum selects to use `getFieldOptions()` for correct key/value pairs and labels. Added value normalization to extract keys from API objects.
- **`EnhancedTable.tsx`**: Updated `valueOptions` to use key/value pairs for `singleSelect` and updated `FieldRenderer` to show the human-readable label for enums.
- **`FilterBar.tsx`**: Updated `extractOptions` to use spec-driven labels for enum filters.
- **`ResourceView.tsx`**: Centralized filter matching logic into a `getDisplayString` helper, ensuring filter comparisons use the same templates as the UI labels.
4. **App Fixes**:
- `FetchRequests.tsx` and `FetchRequestDetail.tsx` now derive status and format options from the OpenAPI spec via `useConfig()` instead of using hardcoded arrays.
Reviewed-on: #10
Co-authored-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Co-committed-by: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
This commit is contained in:
@@ -36,6 +36,26 @@ function mapOpenApiType(prop: any): FieldType {
|
||||
/**
|
||||
* Recursively converts OpenAPI schemas to ResourceField map
|
||||
*/
|
||||
function mergeProperties(schema: any): { properties: Record<string, any>; required: string[] } {
|
||||
let properties: Record<string, any> = {};
|
||||
let required: string[] = [];
|
||||
|
||||
if (schema.allOf) {
|
||||
for (const sub of schema.allOf) {
|
||||
const merged = mergeProperties(sub);
|
||||
properties = { ...properties, ...merged.properties };
|
||||
required = [...required, ...merged.required];
|
||||
}
|
||||
}
|
||||
if (schema.properties) {
|
||||
properties = { ...properties, ...schema.properties };
|
||||
}
|
||||
if (schema.required) {
|
||||
required = [...required, ...schema.required];
|
||||
}
|
||||
return { properties, required };
|
||||
}
|
||||
|
||||
function parseSchemaFields(
|
||||
schema: any,
|
||||
resourceName: string,
|
||||
@@ -43,12 +63,19 @@ function parseSchemaFields(
|
||||
configuration: Record<string, any> = {}
|
||||
): Record<string, ResourceField> {
|
||||
const fields: Record<string, ResourceField> = {};
|
||||
const properties = schema.properties || {};
|
||||
const required = schema.required || [];
|
||||
const { properties, required } = mergeProperties(schema);
|
||||
const overrides = configuration[resourceName]?.fields || {};
|
||||
|
||||
for (const [key, prop] of Object.entries(properties) as [string, any]) {
|
||||
const type = mapOpenApiType(prop);
|
||||
// Resolve oneOf/anyOf by merging all branch properties
|
||||
let resolvedProp = prop;
|
||||
if (prop.oneOf || prop.anyOf) {
|
||||
const branches = prop.oneOf || prop.anyOf;
|
||||
const merged = mergeProperties({ allOf: branches });
|
||||
resolvedProp = { ...prop, type: 'object', properties: merged.properties, required: merged.required };
|
||||
}
|
||||
|
||||
const type = mapOpenApiType(resolvedProp);
|
||||
const override = overrides[key];
|
||||
|
||||
// Explicitly skip 'id' as it's the primary key and handled elsewhere
|
||||
@@ -57,12 +84,12 @@ function parseSchemaFields(
|
||||
fields[key] = {
|
||||
type,
|
||||
label:
|
||||
prop.title ||
|
||||
resolvedProp.title ||
|
||||
key.charAt(0).toUpperCase() + key.slice(1).replace(/_/g, " "),
|
||||
required: required.includes(key),
|
||||
options: prop.enum,
|
||||
options: resolvedProp.enum,
|
||||
readOnly:
|
||||
prop.readOnly ||
|
||||
resolvedProp.readOnly ||
|
||||
key === "created_at" ||
|
||||
key === "updated_at",
|
||||
...override,
|
||||
@@ -71,20 +98,35 @@ function parseSchemaFields(
|
||||
// STRICT RELATION DETECTION
|
||||
// A field is a relation ONLY if its schema object (or items schema)
|
||||
// exactly matches a schema that is defined as a resource.
|
||||
let targetSchema = prop;
|
||||
if (type === "array" && prop.items) {
|
||||
targetSchema = prop.items;
|
||||
let targetSchema = resolvedProp;
|
||||
if (type === "array" && resolvedProp.items) {
|
||||
targetSchema = resolvedProp.items;
|
||||
}
|
||||
|
||||
// Check if this schema object is registered as a resource
|
||||
const relation = schemaToResourceMap.get(targetSchema);
|
||||
if (relation) {
|
||||
fields[key].relation = relation;
|
||||
|
||||
// Propagate enumOption from target resource config, or derive from target schema
|
||||
const explicitEnumOption = configuration[relation]?.enumOption;
|
||||
if (explicitEnumOption) {
|
||||
fields[key].enumOption = explicitEnumOption;
|
||||
} else {
|
||||
const targetProps = targetSchema.properties || {};
|
||||
const valueField = Object.entries(targetProps).find(
|
||||
([name, p]: [string, any]) => name !== 'id' && p.type === 'string'
|
||||
)?.[0];
|
||||
fields[key].enumOption = {
|
||||
key: 'id',
|
||||
value: valueField ?? 'id',
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// Recursively parse nested objects (only if not a relation)
|
||||
if (fields[key].type === "object" && prop.properties && !relation) {
|
||||
fields[key].schema = parseSchemaFields(prop, resourceName, schemaToResourceMap, configuration);
|
||||
if (fields[key].type === "object" && resolvedProp.properties && !relation) {
|
||||
fields[key].schema = parseSchemaFields(resolvedProp, resourceName, schemaToResourceMap, configuration);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -172,6 +214,16 @@ export async function loadConfigFromOpenApi(baseUrl: string, configuration: Reco
|
||||
});
|
||||
}
|
||||
|
||||
// Collect standalone enum schemas (e.g. FetchRequestStatus, AccountType, etc.)
|
||||
const enums: Record<string, string[]> = {};
|
||||
if (api.components?.schemas) {
|
||||
for (const [name, schema] of Object.entries(api.components.schemas) as [string, any]) {
|
||||
if (schema.enum) {
|
||||
enums[name] = schema.enum;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// @ts-ignore
|
||||
const serverBaseUrl = import.meta.env.VITE_API_BASE_URL || (api.servers?.[0]?.url ?? "")
|
||||
// @ts-ignore
|
||||
@@ -180,6 +232,7 @@ export async function loadConfigFromOpenApi(baseUrl: string, configuration: Reco
|
||||
baseUrl: serverBaseUrl,
|
||||
authBaseUrl: authBaseUrl,
|
||||
resources,
|
||||
enums,
|
||||
profile: profileConfiguration,
|
||||
};
|
||||
}
|
||||
|
||||
33
react-openapi/utils/options.ts
Normal file
33
react-openapi/utils/options.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import { ResourceField, SelectOption } from "../types/config";
|
||||
|
||||
export function resolveTemplate(template: string, item: any): string {
|
||||
if (/\{(\w+)\}/.test(template)) {
|
||||
return template.replace(/\{(\w+)\}/g, (_, field: string) => String(item[field] ?? ''));
|
||||
}
|
||||
return String(item[template] ?? '');
|
||||
}
|
||||
|
||||
export function getFieldOptions(field: ResourceField, relationData?: any[]): SelectOption[] {
|
||||
if (field.type === 'enum') {
|
||||
return (field.options ?? []).map(opt => ({
|
||||
key: opt,
|
||||
value: field.enumLabels?.[opt] ?? opt,
|
||||
}));
|
||||
}
|
||||
|
||||
if (field.relation) {
|
||||
const data = relationData ?? [];
|
||||
const enumOption = field.enumOption ?? { key: 'id', value: 'name' };
|
||||
|
||||
return data.map(item => ({
|
||||
key: String(item[enumOption.key] ?? ''),
|
||||
value: resolveTemplate(enumOption.value, item),
|
||||
}));
|
||||
}
|
||||
|
||||
return [];
|
||||
}
|
||||
|
||||
export function toGridValueOptions(options: SelectOption[]): { value: string; label: string }[] {
|
||||
return options.map(opt => ({ value: opt.key, label: opt.value }));
|
||||
}
|
||||
Reference in New Issue
Block a user