Example next.js and Material-UI next: TabNav with shared state

AppBarWithTabs.js

import React from 'react'
import Router from 'next/router'
import AppBarMD from 'material-ui/AppBar'
import Tabs, { Tab } from 'material-ui/Tabs'

const routes = [
  '/',
  '/articles'
]

// Shared State
let newIndex = 0
let lastIndex

class AppBar extends React.Component {
  handleChange = (event, index) => {
    lastIndex = newIndex
    newIndex = index
    Router.push(routes[index])
  };

  componentDidMount () {
    if (typeof lastIndex !== 'undefined') {
      setTimeout(() => {
        lastIndex = undefined
        this.forceUpdate()
      }, 0)
    }
  }

  render () {
    const index = typeof lastIndex === 'undefined'
      ? newIndex
      : lastIndex
    return (
      <AppBarMD position='static'>
        <Tabs index={index} onChange={this.handleChange}>
          {routes.map((route, index) => (
            <Tab key={index} label={route} />
          ))}
        </Tabs>
      </AppBarMD>
    )
  }
}

export default AppBar

sasfasfsa