DSingh0304 opened a new pull request, #3274:
URL: https://github.com/apache/apisix-dashboard/pull/3274
## Description
This PR adds a
[SchemaForm](cci:1://file:///home/deep/Desktop/Code/Organizations/apisix-dashboard/src/components/form/SchemaForm/index.tsx:26:0-85:2)
component that automatically generates form UI from JSON Schema. This is a
working proof-of-concept demonstrating the approach discussed in #2986.
### Features
- **Basic type mapping**: Converts JSON Schema types to existing form
components
- `string` →
[FormItemTextInput](cci:1://file:///home/deep/Desktop/Code/Organizations/apisix-dashboard/src/components/form/TextInput.tsx:28:0-48:2)
- `number/integer` →
[FormItemNumberInput](cci:1://file:///home/deep/Desktop/Code/Organizations/apisix-dashboard/src/components/form/NumberInput.tsx:28:0-50:2)
- `boolean` →
[FormItemSwitch](cci:1://file:///home/deep/Desktop/Code/Organizations/apisix-dashboard/src/components/form/Switch.tsx:30:0-52:2)
- `enum` →
[FormItemSelect](cci:1://file:///home/deep/Desktop/Code/Organizations/apisix-dashboard/src/components/form/Select.tsx:31:0-58:2)
- **`oneOf` support**: Conditional field groups based on a discriminator
field
- Example: Select "oauth" → shows OAuth fields; Select "api_key" → shows
API Key fields
- **`dependencies` support**: Conditional fields based on other field values
- Example: Select "redis" storage → shows Redis Host/Port fields
### Demo
A demo page is available at `/schema_form_demo` to test the functionality.
### Technical Approach
1. **Zero new dependencies** - Reuses existing `FormItem*` components
2. **Uses React Hook Form's `useWatch`** for conditional rendering
3. **Recursive rendering** for nested object schemas
### Related Issue
Related to #2986
### Screenshots
<img width="1920" height="1039" alt="Screenshot from 2026-01-05 11-33-41"
src="https://github.com/user-attachments/assets/7b9a377d-b55b-4729-9032-3fa82a1c27f7";
/>
<img width="1920" height="1039" alt="Screenshot from 2026-01-05 11-33-36"
src="https://github.com/user-attachments/assets/07672d32-504a-483b-b97b-0bd5d00ba9cb";
/>
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
