mirror of https://github.com/apache/superset.git
chore: migrate Fieldset component from jsx to tsx (#17474)
* migrate Fieldset component from jsx to tsx * update type check for fieldKey * remove unused css class called fieldset
This commit is contained in:
parent
a959e6df45
commit
bfba4f1689
|
@ -17,31 +17,33 @@
|
|||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Form } from 'src/components/Form';
|
||||
|
||||
import { recurseReactClone } from './utils';
|
||||
import Field from './Field';
|
||||
|
||||
const propTypes = {
|
||||
children: PropTypes.node.isRequired,
|
||||
onChange: PropTypes.func,
|
||||
item: PropTypes.object,
|
||||
title: PropTypes.node,
|
||||
compact: PropTypes.bool,
|
||||
};
|
||||
const defaultProps = {
|
||||
compact: false,
|
||||
title: null,
|
||||
};
|
||||
interface FieldsetProps {
|
||||
children: React.ReactNode;
|
||||
onChange: Function;
|
||||
item: Record<string, any>;
|
||||
title: React.ReactNode;
|
||||
compact: boolean;
|
||||
}
|
||||
|
||||
export default class Fieldset extends React.PureComponent {
|
||||
constructor(props) {
|
||||
type fieldKeyType = string | number;
|
||||
|
||||
export default class Fieldset extends React.PureComponent<FieldsetProps> {
|
||||
static defaultProps = {
|
||||
compact: false,
|
||||
title: null,
|
||||
};
|
||||
|
||||
constructor(props: FieldsetProps) {
|
||||
super(props);
|
||||
this.onChange = this.onChange.bind(this);
|
||||
}
|
||||
|
||||
onChange(fieldKey, val) {
|
||||
onChange(fieldKey: fieldKeyType, val: any) {
|
||||
return this.props.onChange({
|
||||
...this.props.item,
|
||||
[fieldKey]: val,
|
||||
|
@ -50,18 +52,16 @@ export default class Fieldset extends React.PureComponent {
|
|||
|
||||
render() {
|
||||
const { title } = this.props;
|
||||
const propExtender = field => ({
|
||||
const propExtender = (field: { props: { fieldKey: fieldKeyType } }) => ({
|
||||
onChange: this.onChange,
|
||||
value: this.props.item[field.props.fieldKey],
|
||||
compact: this.props.compact,
|
||||
});
|
||||
return (
|
||||
<Form componentClass="fieldset" className="CRUD" layout="vertical">
|
||||
<Form className="CRUD" layout="vertical">
|
||||
{title && <legend>{title}</legend>}
|
||||
{recurseReactClone(this.props.children, Field, propExtender)}
|
||||
</Form>
|
||||
);
|
||||
}
|
||||
}
|
||||
Fieldset.propTypes = propTypes;
|
||||
Fieldset.defaultProps = defaultProps;
|
Loading…
Reference in New Issue