Implement review

- lint member order
- cleaner type coersion
- specify access modifiers everywhere
This commit is contained in:
Jorik Schellekens 2020-05-26 12:09:23 +01:00
parent dfc73626fa
commit ba3fe850e0
3 changed files with 18 additions and 23 deletions

View file

@ -79,7 +79,7 @@ export default class QueryMatcher<T extends Object> {
// type for their values. We assume that those values who's keys have // type for their values. We assume that those values who's keys have
// been specified will be string. Also, we cannot infer all the // been specified will be string. Also, we cannot infer all the
// types of the keys of the objects at compile. // types of the keys of the objects at compile.
const keyValues: (string)[] = _at<T>(object as any, this._keys) as any; const keyValues = _at<string>(<any>object, this._keys);
for (const f of this._funcs) { for (const f of this._funcs) {
keyValues.push(f(object)); keyValues.push(f(object));

View file

@ -34,7 +34,7 @@ interface IProps extends React.InputHTMLAttributes<HTMLSelectElement | HTMLInput
id?: string, id?: string,
// The element to create. Defaults to "input". // The element to create. Defaults to "input".
// To define options for a select, use <Field><option ... /></Field> // To define options for a select, use <Field><option ... /></Field>
element?: InputType, element?: "input" | " select" | "textarea",
// The field's type (when used as an <input>). Defaults to "text". // The field's type (when used as an <input>). Defaults to "text".
type?: string, type?: string,
// id of a <datalist> element for suggestions // id of a <datalist> element for suggestions
@ -68,12 +68,6 @@ interface IProps extends React.InputHTMLAttributes<HTMLSelectElement | HTMLInput
// All other props pass through to the <input>. // All other props pass through to the <input>.
} }
enum InputType {
INPUT = "input",
SELECT = "select",
TEXTAREA = "textarea",
}
interface IState { interface IState {
valid: boolean, valid: boolean,
feedback: React.ReactNode, feedback: React.ReactNode,
@ -85,7 +79,7 @@ export default class Field extends React.PureComponent<IProps, IState> {
private id: string; private id: string;
private input: HTMLInputElement; private input: HTMLInputElement;
static defaultProps = { private static defaultProps = {
element: "input", element: "input",
type: "text", type: "text",
} }
@ -99,15 +93,12 @@ export default class Field extends React.PureComponent<IProps, IState> {
* We may find that we actually want different behaviour for registration * We may find that we actually want different behaviour for registration
* fields, in which case we can add some options to control it. * fields, in which case we can add some options to control it.
*/ */
validateOnChange = debounce(() => { private validateOnChange = debounce(() => {
this.validate({ this.validate({
focused: true, focused: true,
}); });
}, VALIDATION_THROTTLE_MS); }, VALIDATION_THROTTLE_MS);
focus() {
this.input.focus();
}
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
@ -120,7 +111,11 @@ export default class Field extends React.PureComponent<IProps, IState> {
this.id = this.props.id || getId(); this.id = this.props.id || getId();
} }
onFocus = (ev) => { public focus() {
this.input.focus();
}
private onFocus = (ev) => {
this.setState({ this.setState({
focused: true, focused: true,
}); });
@ -133,7 +128,7 @@ export default class Field extends React.PureComponent<IProps, IState> {
} }
}; };
onChange = (ev) => { private onChange = (ev) => {
this.validateOnChange(); this.validateOnChange();
// Parent component may have supplied its own `onChange` as well // Parent component may have supplied its own `onChange` as well
if (this.props.onChange) { if (this.props.onChange) {
@ -141,7 +136,7 @@ export default class Field extends React.PureComponent<IProps, IState> {
} }
}; };
onBlur = (ev) => { private onBlur = (ev) => {
this.setState({ this.setState({
focused: false, focused: false,
}); });
@ -154,7 +149,7 @@ export default class Field extends React.PureComponent<IProps, IState> {
} }
}; };
async validate({ focused, allowEmpty = true }: {focused: boolean, allowEmpty?: boolean}) { private async validate({ focused, allowEmpty = true }: {focused: boolean, allowEmpty?: boolean}) {
if (!this.props.onValidate) { if (!this.props.onValidate) {
return; return;
} }
@ -187,7 +182,7 @@ export default class Field extends React.PureComponent<IProps, IState> {
render() { public render() {
const { const {
element, prefixComponent, postfixComponent, className, onValidate, children, element, prefixComponent, postfixComponent, className, onValidate, children,
tooltipContent, flagInvalid, tooltipClassName, list, ...inputProps} = this.props; tooltipContent, flagInvalid, tooltipClassName, list, ...inputProps} = this.props;

View file

@ -46,12 +46,12 @@ export default class Tooltip extends React.Component<IProps> {
private parent: Element; private parent: Element;
static defaultProps = { public static readonly defaultProps = {
visible: true, visible: true,
}; };
// Create a wrapper for the tooltip outside the parent and attach it to the body element // Create a wrapper for the tooltip outside the parent and attach it to the body element
componentDidMount() { public componentDidMount() {
this.tooltipContainer = document.createElement("div"); this.tooltipContainer = document.createElement("div");
this.tooltipContainer.className = "mx_Tooltip_wrapper"; this.tooltipContainer.className = "mx_Tooltip_wrapper";
document.body.appendChild(this.tooltipContainer); document.body.appendChild(this.tooltipContainer);
@ -62,12 +62,12 @@ export default class Tooltip extends React.Component<IProps> {
this.renderTooltip(); this.renderTooltip();
} }
componentDidUpdate() { public componentDidUpdate() {
this.renderTooltip(); this.renderTooltip();
} }
// Remove the wrapper element, as the tooltip has finished using it // Remove the wrapper element, as the tooltip has finished using it
componentWillUnmount() { public componentWillUnmount() {
dis.dispatch<ViewTooltipPayload>({ dis.dispatch<ViewTooltipPayload>({
action: Action.ViewTooltip, action: Action.ViewTooltip,
tooltip: null, tooltip: null,
@ -128,7 +128,7 @@ export default class Tooltip extends React.Component<IProps> {
}); });
} }
render() { public render() {
// Render a placeholder // Render a placeholder
return ( return (
<div className={this.props.className} > <div className={this.props.className} >