diff options
| -rw-r--r-- | src/settings/components/form/BlacklistForm.tsx | 38 | ||||
| -rw-r--r-- | src/settings/components/index.tsx | 11 | ||||
| -rw-r--r-- | src/settings/reducers/setting.ts | 2 | ||||
| -rw-r--r-- | src/shared/SettingData.ts | 10 | ||||
| -rw-r--r-- | src/shared/settings/Properties.ts | 2 |
5 files changed, 35 insertions, 28 deletions
diff --git a/src/settings/components/form/BlacklistForm.tsx b/src/settings/components/form/BlacklistForm.tsx index 637bc1e..f352e41 100644 --- a/src/settings/components/form/BlacklistForm.tsx +++ b/src/settings/components/form/BlacklistForm.tsx @@ -2,10 +2,11 @@ import './BlacklistForm.scss'; import AddButton from '../ui/AddButton'; import DeleteButton from '../ui/DeleteButton'; import React from 'react'; +import { BlacklistJSON } from '../../../shared/settings/Blacklist'; interface Props { - value: string[]; - onChange: (value: string[]) => void; + value: BlacklistJSON; + onChange: (value: BlacklistJSON) => void; onBlur: () => void; } @@ -19,19 +20,24 @@ class BlacklistForm extends React.Component<Props> { render() { return <div className='form-blacklist-form'> { - this.props.value.map((url, index) => { - return <div key={index} className='form-blacklist-form-row'> - <input data-index={index} type='text' name='url' - className='column-url' value={url} - onChange={this.bindValue.bind(this)} - onBlur={this.props.onBlur} - /> - <DeleteButton data-index={index} name='delete' - onClick={this.bindValue.bind(this)} - onBlur={this.props.onBlur} - /> - </div>; - }) + this.props.value + .map((item, index) => { + if (typeof item !== 'string') { + // TODO support partial blacklist; + return null; + } + return <div key={index} className='form-blacklist-form-row'> + <input data-index={index} type='text' name='url' + className='column-url' value={item} + onChange={this.bindValue.bind(this)} + onBlur={this.props.onBlur} + /> + <DeleteButton data-index={index} name='delete' + onClick={this.bindValue.bind(this)} + onBlur={this.props.onBlur} + /> + </div>; + }) } <AddButton name='add' style={{ float: 'right' }} onClick={this.bindValue.bind(this)} /> @@ -41,7 +47,7 @@ class BlacklistForm extends React.Component<Props> { bindValue(e: any) { let name = e.target.name; let index = e.target.getAttribute('data-index'); - let next = this.props.value ? this.props.value.slice() : []; + let next = this.props.value.slice(); if (name === 'url') { next[index] = e.target.value; diff --git a/src/settings/components/index.tsx b/src/settings/components/index.tsx index bd99d52..586f0f0 100644 --- a/src/settings/components/index.tsx +++ b/src/settings/components/index.tsx @@ -32,7 +32,7 @@ class SettingsComponent extends React.Component<Props> { this.props.dispatch(settingActions.load()); } - renderFormFields(form: any) { + renderFormFields(form: FormSettings) { return <div> <fieldset> <legend>Keybindings</legend> @@ -53,7 +53,7 @@ class SettingsComponent extends React.Component<Props> { <fieldset> <legend>Blacklist</legend> <BlacklistForm - value={form.blacklist} + value={form.blacklist.toJSON()} onChange={this.bindBlacklistForm.bind(this)} onBlur={this.save.bind(this)} /> @@ -62,7 +62,7 @@ class SettingsComponent extends React.Component<Props> { <legend>Properties</legend> <PropertiesForm types={Properties.types()} - value={form.properties} + value={form.properties.toJSON()} onChange={this.bindPropertiesForm.bind(this)} onBlur={this.save.bind(this)} /> @@ -89,10 +89,9 @@ class SettingsComponent extends React.Component<Props> { let fields = null; let disabled = this.props.error.length > 0; if (this.props.source === 'form') { - fields = this.renderFormFields(this.props.form); + fields = this.renderFormFields(this.props.form!!); } else if (this.props.source === 'json') { - fields = this.renderJsonFields( - this.props.json as JSONTextSettings, this.props.error); + fields = this.renderJsonFields(this.props.json!!, this.props.error); } return ( <div> diff --git a/src/settings/reducers/setting.ts b/src/settings/reducers/setting.ts index 89bf1cb..804853f 100644 --- a/src/settings/reducers/setting.ts +++ b/src/settings/reducers/setting.ts @@ -2,6 +2,7 @@ import * as actions from '../actions'; import { JSONTextSettings, FormSettings, SettingSource, } from '../../shared/SettingData'; +import { DefaultSetting } from '../../shared/settings/Settings'; export interface State { source: SettingSource; @@ -13,6 +14,7 @@ export interface State { const defaultState: State = { source: SettingSource.JSON, json: JSONTextSettings.fromText(''), + form: FormSettings.fromSettings(DefaultSetting), error: '', }; diff --git a/src/shared/SettingData.ts b/src/shared/SettingData.ts index 2dedfef..c28a5dd 100644 --- a/src/shared/SettingData.ts +++ b/src/shared/SettingData.ts @@ -141,13 +141,13 @@ export class JSONTextSettings { } export class FormSettings { - private keymaps: FormKeymaps; + public readonly keymaps: FormKeymaps; - private search: FormSearch; + public readonly search: FormSearch; - private properties: Properties; + public readonly properties: Properties; - private blacklist: Blacklist; + public readonly blacklist: Blacklist; constructor( keymaps: FormKeymaps, @@ -210,7 +210,7 @@ export class FormSettings { keymaps: ReturnType<FormKeymaps['toJSON']>; search: ReturnType<FormSearch['toJSON']>; properties: ReturnType<Properties['toJSON']>; - blacklist: string[]; + blacklist: ReturnType<Blacklist['toJSON']>; } { return { keymaps: this.keymaps.toJSON(), diff --git a/src/shared/settings/Properties.ts b/src/shared/settings/Properties.ts index 1bc4c7f..63ff991 100644 --- a/src/shared/settings/Properties.ts +++ b/src/shared/settings/Properties.ts @@ -59,7 +59,7 @@ export default class Properties { hintchars?: string; smoothscroll?: boolean; complete?: string; - }) { + } = {}) { this.hintchars = hintchars || defaultValues.hintchars; this.smoothscroll = smoothscroll || defaultValues.smoothscroll; this.complete = complete || defaultValues.complete; |