1 files changed, 24 insertions, 16 deletions
diff --git a/src/Dashboard.tsx b/src/Dashboard.tsx
index 04ced46..10f727e 100644
--- a/src/Dashboard.tsx
+++ b/src/Dashboard.tsx
@@ -1,23 +1,23 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import 'typeface-roboto';
-import { withStyles, MuiThemeProvider } from '@material-ui/core/styles';
+import { Theme, withStyles, MuiThemeProvider } from '@material-ui/core/styles';
 import CssBaseline from '@material-ui/core/CssBaseline';
 import AppBar from '@material-ui/core/AppBar';
 import Toolbar from '@material-ui/core/Toolbar';
 import Typography from '@material-ui/core/Typography';
 import Paper from '@material-ui/core/Paper';
 import Tabs from '@material-ui/core/Tabs';
-import Tab from '@material-ui/core/Tab';
+import Tab, { TabProps } from '@material-ui/core/Tab';
+import { LinkProps } from '@material-ui/core/Link';
 import Grid from '@material-ui/core/Grid';
-import { HashRouter as Router, withRouter, Route, Link, Redirect, Switch } from "react-router-dom";
-import { hashHistory } from 'react-router';
+import { HashRouter as Router, RouteComponentProps, withRouter, Route, Link, Redirect, Switch } from "react-router-dom";
 import Logo from './Logo';
 import { theme } from './theme';
 import Analyze from './Analyze';
 import Settings from './Settings';
 
-const styles = theme => ({
+const styles = (theme: Theme) => ({
     root: {
         display: 'flex',
         height: '100vh',
@@ -44,8 +44,21 @@ const styles = theme => ({
     }
 });
 
-class DashboardTabs extends React.Component {
-    handleChangeTab = (event, currentTab) => {
+interface DashboardTabsProps extends RouteComponentProps {
+    classes: {
+        root: string,
+        appBar: string,
+        appBarSpacer: string,
+        toolbar: string,
+        title: string,
+        indicator: string,
+        content: string
+    };
+}
+
+
+class DashboardTabs extends React.Component<DashboardTabsProps> {
+    handleChangeTab = (event: React.SyntheticEvent<{}>, currentTab: any) => {
         this.props.history.push(currentTab);
     }
     render() {
@@ -59,12 +72,12 @@ class DashboardTabs extends React.Component {
                         <Typography component="h1" variant="h6" color="inherit" noWrap className={classes.title}>
                             <Logo style={{width: '2em', verticalAlign: 'bottom', marginRight: '0.2em'}}/>Chromicle
                         </Typography>
-                        <Tabs styles={{ display: 'inline-block '}}
+                        <Tabs
                             classes={{ indicator: classes.indicator }}
                             value={this.props.history.location.pathname}
                             onChange={this.handleChangeTab}>
-                            <Tab label="Settings" component={Link} to="/settings" value="/settings" />
-                            <Tab label="Analyze" component={Link} to="/analyze" value="/analyze" />
+                            <Tab label="Settings" {...{component: Link, to: "/settings"} as any} value="/settings" />
+                            <Tab label="Analyze" {...{component: Link, to: "/analyze"} as any} value="/analyze" />
                         </Tabs>
                     </Toolbar>
                 </AppBar>
@@ -80,13 +93,8 @@ class DashboardTabs extends React.Component {
     }
 }
 
-DashboardTabs.propTypes = {
-    classes: PropTypes.object.isRequired,
-};
-
-class Dashboard extends React.Component {
+class Dashboard extends React.Component<{}> {
     render() {
-        const { classes } = this.props;
         let Tabs = withRouter(withStyles(styles)(DashboardTabs));
         return (
             <MuiThemeProvider theme={theme}>