diff --git a/src/settings/components/form/blacklist-form.jsx b/src/settings/components/form/blacklist-form.jsx new file mode 100644 index 0000000..83b54da --- /dev/null +++ b/src/settings/components/form/blacklist-form.jsx @@ -0,0 +1,47 @@ +import './blacklist-form.scss'; +import DeleteButton from '../ui/delete-button'; +import { h, Component } from 'preact'; + +class BlacklistForm extends Component { + + render() { + let value = this.props.value; + if (!value) { + value = []; + } + + return
+ { + value.map((url, index) => { + return
+ + +
; + }) + } +
; + } + + bindValue(e) { + if (!this.props.onChange) { + return; + } + + let name = e.target.name; + let index = e.target.getAttribute('data-index'); + let next = this.props.value.slice(); + + if (name === 'url') { + next[index] = e.target.value; + } else if (name === 'delete') { + next.splice(index, 1); + } + + this.props.onChange(next); + } +} + +export default BlacklistForm; diff --git a/src/settings/components/form/blacklist-form.scss b/src/settings/components/form/blacklist-form.scss new file mode 100644 index 0000000..a230d0d --- /dev/null +++ b/src/settings/components/form/blacklist-form.scss @@ -0,0 +1,9 @@ +.form-blacklist-form { + &-row { + display: flex; + + .column-url { + flex: 1; + } + } +} diff --git a/src/settings/components/index.jsx b/src/settings/components/index.jsx index e5b46ad..fb25df6 100644 --- a/src/settings/components/index.jsx +++ b/src/settings/components/index.jsx @@ -3,6 +3,7 @@ import { h, Component } from 'preact'; import Input from './ui/input'; import SearchEngineForm from './form/search-engine-form'; import KeymapsForm from './form/keymaps-form'; +import BlacklistForm from './form/blacklist-form'; import * as settingActions from 'settings/actions/setting'; import * as validator from 'shared/validators/setting'; @@ -42,14 +43,21 @@ class SettingsComponent extends Component { Keybindings this.bindForm('keymaps', value)} />
Search Engines this.bindForm('search', value)} + /> +
+
+ Blacklist + this.bindForm('blacklist', value)} />
; @@ -110,16 +118,13 @@ class SettingsComponent extends Component { } } - bindSearchForm(value) { - let next = Object.assign({}, this.state); - next.settings.form.search = value; - this.setState(next); - this.context.store.dispatch(settingActions.save(next.settings)); - } - - bindKeymapsForm(value) { - let next = Object.assign({}, this.state); - next.settings.form.keymaps = value; + bindForm(name, value) { + let next = Object.assign({}, this.state, { + settings: Object.assign({}, this.state.settings, { + form: Object.assign({}, this.state.settings.form) + }) + }); + next.settings.form[name] = value; this.setState(next); this.context.store.dispatch(settingActions.save(next.settings)); } diff --git a/src/shared/default-settings.js b/src/shared/default-settings.js index 6d2013b..218390b 100644 --- a/src/shared/default-settings.js +++ b/src/shared/default-settings.js @@ -125,6 +125,7 @@ export default { ['twitter', 'https,//twitter.com/search?q={}'], ['wikipedia', 'https,//en.wikipedia.org/w/index.php?search={}'], ] - } + }, + 'blacklist': [], } };