import { createContext } from 'react'; import { CodeEditor, Monaco } from '@grafana/ui'; import { K8sNameLookup } from './K8sNameLookup'; // swagger does not have types interface UntypedProps { [k: string]: any; } export type SchemaType = Record | undefined; export type ResourceInfo = { group: string; version: string; resource: string; namespaced: boolean; }; // Use react contexts to stash settings export const SchemaContext = createContext(undefined); export const NamespaceContext = createContext(undefined); export const ResourceContext = createContext(undefined); /* eslint-disable react/display-name */ export const WrappedPlugins = function () { return { wrapComponents: { parameterRow: (Original: React.ElementType) => (props: UntypedProps) => { // When the parameter name is in the path, lets make it a drop down const name = props.param.get('name'); const where = props.param.get('in'); if (name === 'name' && where === 'path') { const path = props.specPath.get(1).split('/'); if (path.length > 4 && path[1] === 'apis') { const info: ResourceInfo = { group: path[2], version: path[3], resource: path[4], namespaced: path[4] === 'namespaces', }; if (info.namespaced) { info.resource = path[6]; } // console.log('NAME (in path)', path, info); return ( ); } } return ; }, // https://github.com/swagger-api/swagger-ui/blob/v5.17.14/src/core/components/parameters/parameters.jsx#L235 // https://github.com/swagger-api/swagger-ui/blob/v5.17.14/src/core/plugins/oas3/components/request-body.jsx#L35 RequestBody: (Original: React.ElementType) => (props: UntypedProps) => { let v: SchemaType = undefined; const content = props.requestBody.get('content'); if (content) { let mime = content.get('application/json') ?? content.get('*/*'); if (mime) { v = mime.get('schema').toJS(); } console.log('RequestBody', v, mime, props); } // console.log('RequestBody PROPS', props); return ( ); }, modelExample: (Original: React.ElementType) => (props: UntypedProps) => { if (props.isExecute && props.schema) { console.log('modelExample PROPS', props); return ( ); } return ; }, JsonSchemaForm: (Original: React.ElementType) => (props: UntypedProps) => { const { description, disabled, required, onChange, value } = props; if (!disabled && required) { switch (description) { case 'namespace': { return ( {(namespace) => { if (!value && namespace) { setTimeout(() => { // Fake type in the value onChange(namespace); }, 100); } return ; }} ); } case 'name': { return ; } } } return ; }, // https://github.com/swagger-api/swagger-ui/blob/v5.17.14/src/core/plugins/oas3/components/request-body-editor.jsx TextArea: (Original: React.ElementType) => (props: UntypedProps) => { return ( {(schema) => { if (schema) { const val = props.value ?? props.defaultValue ?? ''; //console.log('JSON TextArea', props, info); // Return a synthetic text area event const cb = (txt: string) => { props.onChange({ target: { value: txt, }, }); }; console.log('CodeEditor', schema); return ( 500} onBlur={cb} onSave={cb} onBeforeEditorMount={(monaco: Monaco) => { monaco.languages.json.jsonDefaults.setDiagnosticsOptions({ validate: true, schemas: [ { uri: schema['$$ref'] ?? '#internal', fileMatch: ['*'], // everything schema: schema, }, ], }); }} /> ); } return ; }} ); }, }, }; };