Cleanup flow types and fix eslint errors
This commit is contained in:
parent
ef41de4349
commit
c1ed43ee6c
4 changed files with 118 additions and 147 deletions
|
|
@ -21,7 +21,7 @@ type UiItemProps<I> = {
|
|||
onChangeState: (topic: string, nextState: any) => void
|
||||
};
|
||||
|
||||
export default class UiItem<I> extends React.Component<UiItemProps<I>> {
|
||||
export default class UiItem<I:Object> extends React.Component<UiItemProps<I>> {
|
||||
constructor(props: UiItemProps<I>) {
|
||||
super(props);
|
||||
}
|
||||
|
|
@ -30,48 +30,79 @@ export default class UiItem<I> extends React.Component<UiItemProps<I>> {
|
|||
|
||||
}
|
||||
|
||||
render() {
|
||||
return null;
|
||||
}
|
||||
|
||||
/*
|
||||
* TODO: The type system can't really check if the enableCondition is of
|
||||
* any function type or if it is a TopicDependentOption or a
|
||||
* StateDependentOption. This should be fixed.
|
||||
*/
|
||||
isEnabled() {
|
||||
if (Object.keys(this.props.item).includes("enableCondition") &&
|
||||
typeof this.props.item.enableCondition == "function") {
|
||||
const enableCondition = this.props.item.enableCondition;
|
||||
const state = this.props.state;
|
||||
const internals = _.mapValues(state, (x) => x.internal);
|
||||
const actuals = _.mapValues(state, (x) => x.actual);
|
||||
return enableCondition(internals, actuals, state);
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export class UiControl<I: UIControl> extends UiItem<I> {
|
||||
constructor(props: UiItemProps<I>) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
changeState(next: any) {
|
||||
if (this.props.item.topic == null) {
|
||||
throw new Error(
|
||||
`Undefined topic in ${this.props.item.type} "${this.props.item.text}"`
|
||||
`Missing topic in ${this.props.item.type} "${this.props.item.text}"`
|
||||
);
|
||||
}
|
||||
this.props.onChangeState(this.props.item.topic, next);
|
||||
}
|
||||
|
||||
getValue() {
|
||||
const topic: string = this.props.item.topic || "";
|
||||
const control = this.props.item;
|
||||
const topic: string = control.topic || "";
|
||||
const value = this.props.state[topic];
|
||||
if (value == null) {
|
||||
const control = this.props.item;
|
||||
if (topic === "") {
|
||||
throw new Error(
|
||||
`Missing topic in ${control.type} "${control.text}"`
|
||||
);
|
||||
}
|
||||
throw new Error(
|
||||
`Unknown topic "${control.topic}" in ${control.type} "${control.text}"`
|
||||
`Unknown topic "${topic}" in ${control.type} "${control.text}"`
|
||||
);
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
||||
isEnabled() {
|
||||
const enableCondition = this.props.item.enableCondition;
|
||||
if (enableCondition == null) {
|
||||
return true;
|
||||
} else {
|
||||
if (Object.keys(this.props.item).includes("enableCondition") &&
|
||||
typeof this.props.item.enableCondition == "function") {
|
||||
const enableCondition = this.props.item.enableCondition;
|
||||
const value = this.getValue();
|
||||
return enableCondition(
|
||||
value.internal || value.actual, value.actual, this.props.state);
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export class Toggle extends UiItem<UIToggle> {
|
||||
export class Toggle extends UiControl<UIToggle> {
|
||||
isToggled = () => {
|
||||
const value = this.getValue();
|
||||
const control = this.props.item;
|
||||
const isChecked = control.toggled || ((i) => i === (control.on || "on"));
|
||||
const isChecked = control.toggled ||
|
||||
((i, _a, _s) => i === (control.on || "on"));
|
||||
const checked = isChecked(
|
||||
value.internal || value.actual, value.actual, this.props.state);
|
||||
return checked;
|
||||
|
|
@ -99,7 +130,7 @@ export class Toggle extends UiItem<UIToggle> {
|
|||
}
|
||||
}
|
||||
|
||||
export class DropDown extends UiItem<UIDropDown> {
|
||||
export class DropDown extends UiControl<UIDropDown> {
|
||||
runPrimaryAction = (next?: any) => {
|
||||
if (this.isEnabled()) {
|
||||
const control = this.props.item;
|
||||
|
|
@ -117,7 +148,7 @@ export class DropDown extends UiItem<UIDropDown> {
|
|||
render() {
|
||||
const control = this.props.item;
|
||||
const value = this.getValue();
|
||||
const id = `${control.topic}-${control.name}`;
|
||||
const id = `${control.topic}-${control.text}`;
|
||||
const options = control.options;
|
||||
if (options == null) {
|
||||
throw new Error(
|
||||
|
|
@ -173,7 +204,7 @@ export class Section extends UiItem<UISection> {
|
|||
}
|
||||
}
|
||||
|
||||
export class Text extends UiItem<UIText> {
|
||||
export class Text extends UiControl<UIText> {
|
||||
render() {
|
||||
return [
|
||||
<ListItemText key="label" primary={this.props.item.text} />,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue