site: update fluxible-addons-react imports (#715)

yahoo · Jun 21, 2021 · 7b85122 · 7b85122
1 parent d62b247
commit 7b85122
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 23 deletions.
diff --git a/site/components/Debug.js b/site/components/Debug.js
@@ -1,28 +1,26 @@
 import React from 'react';
-import { FluxibleContext } from 'fluxible-addons-react';
+import { FluxibleComponentContext } from 'fluxible-addons-react';
 import { Actions } from 'fluxible-plugin-devtools';
 
 class Debug extends React.Component {
-
-    static contextType = FluxibleContext;
+    static contextType = FluxibleComponentContext;
 
     constructor() {
         super();
         this.state = {
             shouldRender: false,
-            relativeWidth: false
+            relativeWidth: false,
         };
     }
 
-
     componentDidMount() {
         if (this.context.query.debug) {
-            this.setState({shouldRender: true});
+            this.setState({ shouldRender: true });
         }
     }
 
     handleRelativeWidth(event) {
-        this.setState({relativeWidth: event.target.checked});
+        this.setState({ relativeWidth: event.target.checked });
     }
 
     render() {
@@ -43,7 +41,7 @@ class Debug extends React.Component {
             position: 'fixed',
             top: 0,
             width: '80%',
-            zIndex: 100
+            zIndex: 100,
         };
         return (
             <div style={styles}>

diff --git a/site/components/Search.js b/site/components/Search.js
@@ -8,25 +8,25 @@ import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { navigateAction, RouteStore } from 'fluxible-router';
-import { connectToStores, FluxibleContext } from 'fluxible-addons-react';
+import {
+    connectToStores,
+    FluxibleComponentContext,
+} from 'fluxible-addons-react';
 import loadIndex from '../actions/loadIndex';
 import SearchStore from '../stores/SearchStore';
-import debugLib from 'debug';
-const debug = debugLib('Search');
 const ENTER_KEY_CODE = 13;
 
 class Search extends React.Component {
-
-    static contextType = FluxibleContext;
+    static contextType = FluxibleComponentContext;
 
     static propTypes = {
-        currentRoute: PropTypes.object
+        currentRoute: PropTypes.object,
     };
 
     constructor() {
         super();
         this.state = {
-            visible: false
+            visible: false,
         };
     }
 
@@ -37,7 +37,7 @@ class Search extends React.Component {
         const query = this.props.currentRoute.query.q;
         if (query) {
             this.setState({
-                visible: true
+                visible: true,
             });
         }
     }
@@ -59,7 +59,7 @@ class Search extends React.Component {
 
     _toggleSearchVisibility() {
         this.setState({
-            visible: !this.state.visible
+            visible: !this.state.visible,
         });
     }
 
@@ -74,7 +74,7 @@ class Search extends React.Component {
 
             this.context.executeAction(navigateAction, {
                 method: 'GET',
-                url: this._getPath() + '?q=' + event.target.value
+                url: this._getPath() + '?q=' + event.target.value,
             });
         }
     }
@@ -83,12 +83,14 @@ class Search extends React.Component {
         let classes = cx({
             'D(ib) Mstart(3px) Ov(h) Va(m) Pos(a) End(20px)': true,
             'W(0)': this.state.visible === false,
-            'W(200px)': this.state.visible
+            'W(200px)': this.state.visible,
         });
         return (
             <div className="D(ib)">
                 <form className={classes}>
-                    <label htmlFor="q" className="hidden">Search</label>
+                    <label htmlFor="q" className="hidden">
+                        Search
+                    </label>
                     <input
                         ref="q"
                         type="text"
@@ -99,14 +101,17 @@ class Search extends React.Component {
                         id="q"
                     />
                 </form>
-                <i className="Va(m) Pos(r) fa fa-search Cur(p)" onClick={this._toggleSearchVisibility.bind(this)}></i>
+                <i
+                    className="Va(m) Pos(r) fa fa-search Cur(p)"
+                    onClick={this._toggleSearchVisibility.bind(this)}
+                ></i>
             </div>
         );
     }
 }
 
-Search = connectToStores(Search, [ SearchStore ], (context) => ({
-    search: context.getStore(SearchStore).getState()
+Search = connectToStores(Search, [SearchStore], (context) => ({
+    search: context.getStore(SearchStore).getState(),
 }));
 
 export default Search;