remove material ui entirely!

shared/common-adapters/icon.desktop.js

@@ -2,14 +2,26 @@
 import * as shared from './icon.shared'
 import React, {Component} from 'react'
 import shallowEqual from 'shallowequal'
-import FontIcon from 'material-ui/FontIcon'
 import {globalStyles, globalColors} from '../styles'
 import {iconMeta} from './icon.constants'
 import {resolveImageAsURL} from '../desktop/resolve-root'
+import Box from './box'
+import glamorous from 'glamorous'
 
 import type {Exact} from '../constants/types/more'
 import type {Props, IconType} from './icon'
 
+const StyledSpan = glamorous.span(props => ({
+  color: props.color,
+  ...(props.hoverColor
+    ? {
+        ':hover': {
+          color: props.hoverColor,
+        },
+      }
+    : null),
+}))
+
 class Icon extends Component<void, Exact<Props>, void> {
   shouldComponentUpdate(nextProps: Exact<Props>, nextState: any): boolean {
     return !shallowEqual(this.props, nextProps, (obj, oth, key) => {
@@ -70,24 +82,26 @@ class Icon extends Component<void, Exact<Props>, void> {
       delete cleanStyle.hoverColor
 
       return (
-        <FontIcon
-          title={this.props.hint}
-          style={{
-            ...globalStyles.noSelect,
-            ...styles.icon,
-            ...fontSizeHint,
-            ...cleanStyle,
-            ...(onClick ? globalStyles.clickable : {}),
-          }}
-          className={this.props.className || ''}
-          color={color}
-          hoverColor={onClick ? hoverColor : null}
-          onMouseEnter={this.props.onMouseEnter}
-          onMouseLeave={this.props.onMouseLeave}
-          onClick={onClick}
-        >
-          {String.fromCharCode(iconMeta[iconType].charCode || 0)}
-        </FontIcon>
+        <Box>
+          <StyledSpan
+            alt={this.props.hint}
+            color={color}
+            style={{
+              ...globalStyles.noSelect,
+              ...styles.icon,
+              ...fontSizeHint,
+              ...cleanStyle,
+              ...(onClick ? globalStyles.clickable : {}),
+            }}
+            className={this.props.className || ''}
+            onMouseEnter={this.props.onMouseEnter}
+            onMouseLeave={this.props.onMouseLeave}
+            hoverColor={onClick ? hoverColor : null}
+            onClick={onClick}
+          >
+            {String.fromCharCode(iconMeta[iconType].charCode || 0)}
+          </StyledSpan>
+        </Box>
       )
     } else {
       return (

shared/desktop/renderer/container.js

@@ -1,17 +1,12 @@
 // @flow
 import React from 'react'
 import {Provider} from 'react-redux'
-import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
-import materialTheme from '../../styles/material-theme.desktop'
-
 import '../renderer/style.css'
 
 const Root = ({store, children}: any) => (
-  <MuiThemeProvider muiTheme={materialTheme}>
-    <Provider store={store}>
-      {children}
-    </Provider>
-  </MuiThemeProvider>
+  <Provider store={store}>
+    {children}
+  </Provider>
 )
 
 export default Root

shared/desktop/renderer/dumb.js

@@ -4,8 +4,6 @@ import './style.css'
 import React from 'react'
 import ReactDOM from 'react-dom'
 import {AppContainer} from 'react-hot-loader'
-import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
-import materialTheme from '../../styles/material-theme.desktop'
 import {GlobalEscapeHandler} from '../../util/escape-handler'
 
 module.hot && module.hot.accept('../../dev/dumb-sheet/render.desktop', render)
@@ -43,11 +41,9 @@ function render() {
   const DumbSheet = require('../../dev/dumb-sheet/render.desktop').default
   ReactDOM.render(
     <AppContainer>
-      <MuiThemeProvider muiTheme={materialTheme}>
-        <GlobalEscapeHandler>
-          <Wrapper DumbSheet={DumbSheet} />
-        </GlobalEscapeHandler>
-      </MuiThemeProvider>
+      <GlobalEscapeHandler>
+        <Wrapper DumbSheet={DumbSheet} />
+      </GlobalEscapeHandler>
     </AppContainer>,
     document.getElementById('root')
   )

shared/desktop/webpack.config.babel.js

@@ -267,11 +267,6 @@ const makeDllConfig = () => {
       'immutable',
       'inline-style-prefixer',
       'lodash',
-      'material-ui/svg-icons',
-      'material-ui/FontIcon',
-      'material-ui/styles/spacing',
-      'material-ui/styles/getMuiTheme',
-      'material-ui/styles/MuiThemeProvider',
       'moment',
       'prop-types',
       'qrcode-generator',

shared/libs/flow-interface.js.flow

@@ -33,15 +33,6 @@ declare module 'lodash/merge' {
 declare module 'marked' {
   declare var exports: any
 }
-declare module 'material-ui' {
-  declare var exports: any
-}
-declare module 'material-ui/styles' {
-  declare var exports: any
-}
-declare module 'material-ui/svg-icons' {
-  declare var exports: any
-}
 declare module 'moment' {
   declare var exports: any
 }

shared/package.json

@@ -77,7 +77,6 @@
     "jsonfile": "3.0.0",
     "klaw-sync": "2.1.0",
     "lodash": "4.17.4",
-    "material-ui": "0.15.4",
     "menubar": "5.2.3",
     "mkdirp": "0.5.1",
     "moment": "2.18.1",
@@ -98,7 +97,6 @@
     "react-native-push-notification": "git://github.com/keybase/react-native-push-notification#eedae53f4346223b5aee60ef2702ecc47a01fcd2",
     "react-navigation": "git://github.com/keybase/react-navigation#89d3c8eaefe61739357065b93d053f54df39268f",
     "react-redux": "5.0.5",
-    "react-tap-event-plugin": "2.0.1",
     "react-transition-group": "1.x",
     "react-virtualized": "9.7.6",
     "recompose": "0.23.4",

shared/stories/index.desktop.js

@@ -3,8 +3,6 @@
 import React from 'react'
 import ScrollView from '../common-adapters/scroll-view'
 import {configure, addDecorator} from '@storybook/react'
-import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
-import materialTheme from '../styles/material-theme.desktop'
 
 // Load css
 import '../desktop/renderer/style.css'
@@ -14,13 +12,10 @@ const load = () => {
   // $FlowIssue
   const req = require.context('..', true, /\.stories\.js$/)
 
-  // Add material-ui dependency
   addDecorator(story => (
-    <MuiThemeProvider muiTheme={materialTheme}>
-      <ScrollView key="scrollview" style={{flex: 1}}>
-        {story()}
-      </ScrollView>
-    </MuiThemeProvider>
+    <ScrollView key="scrollview" style={{flex: 1}}>
+      {story()}
+    </ScrollView>
   ))
 
   configure(() => {

shared/test/render-dumb-sheet.js

@@ -2,9 +2,7 @@
 import {ipcRenderer} from 'electron'
 import React from 'react'
 import ReactDOM from 'react-dom'
-import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
 import {GlobalEscapeHandler} from '../util/escape-handler'
-import materialTheme from '../styles/material-theme.desktop'
 import dumbComponentMap from '../dev/dumb-sheet/component-map.desktop'
 import DumbSheetItem from '../dev/dumb-sheet/item'
 
@@ -14,18 +12,16 @@ const PADDING = 25
 
 function Mock({map, mockKey}) {
   return (
-    <MuiThemeProvider muiTheme={materialTheme}>
-      <GlobalEscapeHandler>
-        <DumbSheetItem
-          key={mockKey}
-          id="rendered"
-          style={{alignSelf: 'flex-start', margin: PADDING}}
-          component={map.component}
-          mockKey={mockKey}
-          mock={map.mocks[mockKey]}
-        />
-      </GlobalEscapeHandler>
-    </MuiThemeProvider>
+    <GlobalEscapeHandler>
+      <DumbSheetItem
+        key={mockKey}
+        id="rendered"
+        style={{alignSelf: 'flex-start', margin: PADDING}}
+        component={map.component}
+        mockKey={mockKey}
+        mock={map.mocks[mockKey]}
+      />
+    </GlobalEscapeHandler>
   )
 }