nope/resources/ui/dynamic/dynamicRenderer.tsx
2020-11-04 22:36:52 +01:00

49 lines
1.4 KiB
TypeScript

import React from "react";
import { Alert } from "react-bootstrap";
import { COMPONENTS } from './components';
import { IDynamicRenderSettings } from './interfaces/IDynamicRenderSettings';
class DynamicRenderer extends React.Component<IDynamicRenderSettings, {}> {
/**
* Function will be called if the Item has been rendered sucessfully.
*/
componentDidMount() {
const _this = this;
if (typeof _this.props.onMount === 'function') {
_this.props.onMount();
}
}
/**
* Function, that will be called before the network fails.
*/
componentWillUnmount() {
// Call the unmount
if (typeof this.props.onUnmount === 'function') {
this.props.onUnmount();
}
}
constructor(props) {
super(props);
}
public render() {
if (typeof this.props.component === 'string'){
if (typeof COMPONENTS[this.props.component] !== "undefined") {
return React.createElement(COMPONENTS[this.props.component],{ ...this.props.props});
}
// component doesn't exist yet
return (<>
<Alert variant={'danger'}>
Componenten with id {this.props.component} not defined in <code>COMPONENTS</code>
</Alert>
</>);
}
return React.createElement(this.props.component as any,{ ...this.props.props});
}
}
export default DynamicRenderer;