Fix navicon

client/js/components/pages/Chat/ChatTitle.js

@@ -1,6 +1,6 @@
 import React, { memo } from 'react';
 import { FiUsers, FiSearch, FiX } from 'react-icons/fi';
-import Navicon from 'containers/Navicon';
+import Navicon from 'components/ui/Navicon';
 import Button from 'components/ui/Button';
 import Editable from 'components/ui/Editable';
 import { isValidServerName } from 'state/servers';

client/js/components/pages/Connect.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { createSelector } from 'reselect';
 import { Form, withFormik } from 'formik';
-import Navicon from 'containers/Navicon';
+import Navicon from 'components/ui/Navicon';
 import Button from 'components/ui/Button';
 import Checkbox from 'components/ui/formik/Checkbox';
 import TextInput from 'components/ui/TextInput';

client/js/components/pages/Settings.js

@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react';
-import Navicon from 'containers/Navicon';
+import Navicon from 'components/ui/Navicon';
 import Button from 'components/ui/Button';
 import Checkbox from 'components/ui/Checkbox';
 import FileInput from 'components/ui/FileInput';
@@ -29,7 +29,10 @@ const Settings = ({
         <Navicon />
         <h1>Settings</h1>
         {installable && (
-          <Button className="button-install" onClick={handleInstallClick}>
+          <Button
+            className="settings-button button-install"
+            onClick={handleInstallClick}
+          >
             <h2>Install</h2>
           </Button>
         )}

client/js/components/ui/Navicon.js

@@ -1,7 +1,19 @@
 import React from 'react';
+import { FiMenu } from 'react-icons/fi';
+import { useDispatch } from 'react-redux';
+import Button from 'components/ui/Button';
+import { toggleMenu } from 'state/ui';
 
-const Navicon = ({ onClick }) => (
-  <i className="icon-menu navicon" onClick={onClick} />
-);
+const Navicon = () => {
+  const dispatch = useDispatch();
+
+  return (
+    <Button
+      className="navicon"
+      icon={FiMenu}
+      onClick={() => dispatch(toggleMenu())}
+    />
+  );
+};
 
 export default Navicon;

client/js/containers/Navicon.js

@@ -1,9 +0,0 @@
-import Navicon from 'components/ui/Navicon';
-import { toggleMenu } from 'state/ui';
-import connect from 'utils/connect';
-
-const mapDispatch = {
-  onClick: toggleMenu
-};
-
-export default connect(null, mapDispatch)(Navicon);