Use plugin:prettier/recommended

1 files changed, 118 insertions, 104 deletions

diff --git a/src/settings/components/index.tsx b/src/settings/components/index.tsx
index f4f0326..5793a8f 100644
--- a/src/settings/components/index.tsx
+++ b/src/settings/components/index.tsx
@@ -1,32 +1,36 @@
-import './site.scss';
-import React from 'react';
-import { connect } from 'react-redux';
-import Input from './ui/Input';
-import SearchForm from './form/SearchForm';
-import KeymapsForm from './form/KeymapsForm';
-import BlacklistForm from './form/BlacklistForm';
-import PropertiesForm from './form/PropertiesForm';
-import PartialBlacklistForm from './form/PartialBlacklistForm';
-import * as settingActions from '../../settings/actions/setting';
+import "./site.scss";
+import React from "react";
+import { connect } from "react-redux";
+import Input from "./ui/Input";
+import SearchForm from "./form/SearchForm";
+import KeymapsForm from "./form/KeymapsForm";
+import BlacklistForm from "./form/BlacklistForm";
+import PropertiesForm from "./form/PropertiesForm";
+import PartialBlacklistForm from "./form/PartialBlacklistForm";
+import * as settingActions from "../../settings/actions/setting";
 import SettingData, {
-  FormKeymaps, FormSearch, FormSettings, JSONTextSettings,
-} from '../../shared/SettingData';
-import { State as AppState } from '../reducers/setting';
-import Properties from '../../shared/settings/Properties';
-import Blacklist from '../../shared/settings/Blacklist';
+  FormKeymaps,
+  FormSearch,
+  FormSettings,
+  JSONTextSettings,
+} from "../../shared/SettingData";
+import { State as AppState } from "../reducers/setting";
+import Properties from "../../shared/settings/Properties";
+import Blacklist from "../../shared/settings/Blacklist";
 
 const DO_YOU_WANT_TO_CONTINUE =
-  'Some settings in JSON can be lost when migrating.  ' +
-  'Do you want to continue?';
+  "Some settings in JSON can be lost when migrating.  " +
+  "Do you want to continue?";
 
 type StateProps = ReturnType<typeof mapStateToProps>;
 interface DispatchProps {
-  dispatch: (action: any) => void,
+  dispatch: (action: any) => void;
 }
-type Props = StateProps & DispatchProps & {
-  // FIXME
-  store: any;
-};
+type Props = StateProps &
+  DispatchProps & {
+    // FIXME
+    store: any;
+  };
 
 class SettingsComponent extends React.Component<Props> {
   componentDidMount() {
@@ -34,97 +38,103 @@ class SettingsComponent extends React.Component<Props> {
   }
 
   renderFormFields(form: FormSettings) {
-    return <div>
-      <fieldset>
-        <legend>Keybindings</legend>
-        <KeymapsForm
-          value={form.keymaps}
-          onChange={this.bindKeymapsForm.bind(this)}
-          onBlur={this.save.bind(this)}
-        />
-      </fieldset>
-      <fieldset>
-        <legend>Search Engines</legend>
-        <SearchForm
-          value={form.search}
-          onChange={this.bindSearchForm.bind(this)}
-          onBlur={this.save.bind(this)}
-        />
-      </fieldset>
-      <fieldset>
-        <legend>Blacklist</legend>
-        <BlacklistForm
-          value={form.blacklist}
-          onChange={this.bindBlacklistForm.bind(this)}
-          onBlur={this.save.bind(this)}
-        />
-      </fieldset>
-      <fieldset>
-        <legend>Partial blacklist</legend>
-        <PartialBlacklistForm
-          value={form.blacklist}
-          onChange={this.bindBlacklistForm.bind(this)}
-          onBlur={this.save.bind(this)}
-        />
-      </fieldset>
-      <fieldset>
-        <legend>Properties</legend>
-        <PropertiesForm
-          types={Properties.types()}
-          value={form.properties.toJSON()}
-          onChange={this.bindPropertiesForm.bind(this)}
-          onBlur={this.save.bind(this)}
-        />
-      </fieldset>
-    </div>;
+    return (
+      <div>
+        <fieldset>
+          <legend>Keybindings</legend>
+          <KeymapsForm
+            value={form.keymaps}
+            onChange={this.bindKeymapsForm.bind(this)}
+            onBlur={this.save.bind(this)}
+          />
+        </fieldset>
+        <fieldset>
+          <legend>Search Engines</legend>
+          <SearchForm
+            value={form.search}
+            onChange={this.bindSearchForm.bind(this)}
+            onBlur={this.save.bind(this)}
+          />
+        </fieldset>
+        <fieldset>
+          <legend>Blacklist</legend>
+          <BlacklistForm
+            value={form.blacklist}
+            onChange={this.bindBlacklistForm.bind(this)}
+            onBlur={this.save.bind(this)}
+          />
+        </fieldset>
+        <fieldset>
+          <legend>Partial blacklist</legend>
+          <PartialBlacklistForm
+            value={form.blacklist}
+            onChange={this.bindBlacklistForm.bind(this)}
+            onBlur={this.save.bind(this)}
+          />
+        </fieldset>
+        <fieldset>
+          <legend>Properties</legend>
+          <PropertiesForm
+            types={Properties.types()}
+            value={form.properties.toJSON()}
+            onChange={this.bindPropertiesForm.bind(this)}
+            onBlur={this.save.bind(this)}
+          />
+        </fieldset>
+      </div>
+    );
   }
 
   renderJsonFields(json: JSONTextSettings, error: string) {
-    return <div>
-      <Input
-        type='textarea'
-        name='json'
-        label='Plain JSON'
-        spellCheck={false}
-        error={error}
-        onValueChange={this.bindJson.bind(this)}
-        onBlur={this.save.bind(this)}
-        value={json.toJSONText()}
-      />
-    </div>;
+    return (
+      <div>
+        <Input
+          type="textarea"
+          name="json"
+          label="Plain JSON"
+          spellCheck={false}
+          error={error}
+          onValueChange={this.bindJson.bind(this)}
+          onBlur={this.save.bind(this)}
+          value={json.toJSONText()}
+        />
+      </div>
+    );
   }
 
   render() {
     let fields = null;
     const disabled = this.props.error.length > 0;
-    if (this.props.source === 'form') {
+    if (this.props.source === "form") {
       fields = this.renderFormFields(this.props.form!!);
-    } else if (this.props.source === 'json') {
+    } else if (this.props.source === "json") {
       fields = this.renderJsonFields(this.props.json!!, this.props.error);
     }
     return (
       <div>
         <h1>Configure Vim-Vixen</h1>
-        <form className='vimvixen-settings-form'>
+        <form className="vimvixen-settings-form">
           <Input
-            type='radio'
-            id='setting-source-form'
-            name='source'
-            label='Use form'
-            checked={this.props.source === 'form'}
-            value='form'
+            type="radio"
+            id="setting-source-form"
+            name="source"
+            label="Use form"
+            checked={this.props.source === "form"}
+            value="form"
             onValueChange={this.bindSource.bind(this)}
-            disabled={disabled} />
+            disabled={disabled}
+          />
 
           <Input
-            type='radio'
-            name='source'
-            label='Use plain JSON'
-            checked={this.props.source === 'json'}
-            value='json'
+            type="radio"
+            name="source"
+            label="Use plain JSON"
+            checked={this.props.source === "json"}
+            value="json"
             onValueChange={this.bindSource.bind(this)}
-            disabled={disabled} />
-          { fields }
+            disabled={disabled}
+          />
+          {fields}
         </form>
       </div>
     );
@@ -142,7 +152,8 @@ class SettingsComponent extends React.Component<Props> {
     const data = new SettingData({
       source: this.props.source,
       form: (this.props.form as FormSettings).buildWithSearch(
-        FormSearch.fromJSON(value)),
+        FormSearch.fromJSON(value)
+      ),
     });
     this.props.dispatch(settingActions.set(data));
   }
@@ -159,7 +170,8 @@ class SettingsComponent extends React.Component<Props> {
     const data = new SettingData({
       source: this.props.source,
       form: (this.props.form as FormSettings).buildWithProperties(
-        Properties.fromJSON(value))
+        Properties.fromJSON(value)
+      ),
     });
     this.props.dispatch(settingActions.set(data));
   }
@@ -174,27 +186,29 @@ class SettingsComponent extends React.Component<Props> {
 
   bindSource(_name: string, value: string) {
     const from = this.props.source;
-    if (from === 'form' && value === 'json') {
-      this.props.dispatch(settingActions.switchToJson(
-        this.props.form as FormSettings));
+    if (from === "form" && value === "json") {
+      this.props.dispatch(
+        settingActions.switchToJson(this.props.form as FormSettings)
+      );
       this.save();
-    } else if (from === 'json' && value === 'form') {
+    } else if (from === "json" && value === "form") {
       const b = window.confirm(DO_YOU_WANT_TO_CONTINUE);
       if (!b) {
         this.forceUpdate();
         return;
       }
       this.props.dispatch(
-        settingActions.switchToForm(this.props.json as JSONTextSettings));
+        settingActions.switchToForm(this.props.json as JSONTextSettings)
+      );
       this.save();
     }
   }
 
   save() {
     const { source, json, form } = this.props.store.getState();
-    this.props.dispatch(settingActions.save(
-      new SettingData({ source, json, form }),
-    ));
+    this.props.dispatch(
+      settingActions.save(new SettingData({ source, json, form }))
+    );
   }
 }