2018-08-12 02:39:48 +00:00
|
|
|
import React from 'react'
|
2018-12-17 16:34:32 +00:00
|
|
|
import App, { Container } from 'next/app'
|
2018-08-12 02:39:48 +00:00
|
|
|
import Link from 'next/link'
|
|
|
|
import NProgress from 'nprogress'
|
|
|
|
import Router from 'next/router'
|
|
|
|
|
|
|
|
const linkStyle = {
|
|
|
|
margin: '0 10px 0 0'
|
|
|
|
}
|
|
|
|
|
2018-12-17 16:34:32 +00:00
|
|
|
Router.events.on('routeChangeStart', url => {
|
2018-08-12 02:39:48 +00:00
|
|
|
console.log(`Loading: ${url}`)
|
|
|
|
NProgress.start()
|
2018-08-13 21:17:39 +00:00
|
|
|
})
|
|
|
|
Router.events.on('routeChangeComplete', () => NProgress.done())
|
|
|
|
Router.events.on('routeChangeError', () => NProgress.done())
|
2018-08-12 02:39:48 +00:00
|
|
|
|
|
|
|
export default class MyApp extends App {
|
|
|
|
static async getInitialProps ({ Component, router, ctx }) {
|
|
|
|
let pageProps = {}
|
|
|
|
|
|
|
|
if (Component.getInitialProps) {
|
|
|
|
pageProps = await Component.getInitialProps(ctx)
|
|
|
|
}
|
|
|
|
|
2018-12-17 16:34:32 +00:00
|
|
|
return { pageProps }
|
2018-08-12 02:39:48 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
render () {
|
2018-12-17 16:34:32 +00:00
|
|
|
const { Component, pageProps } = this.props
|
2018-08-12 02:39:48 +00:00
|
|
|
return (
|
|
|
|
<Container>
|
|
|
|
<div style={{ marginBottom: 20 }}>
|
2018-12-17 16:34:32 +00:00
|
|
|
<Link href='/'>
|
|
|
|
<a style={linkStyle}>Home</a>
|
|
|
|
</Link>
|
|
|
|
<Link href='/about'>
|
|
|
|
<a style={linkStyle}>About</a>
|
|
|
|
</Link>
|
|
|
|
<Link href='/forever'>
|
|
|
|
<a style={linkStyle}>Forever</a>
|
|
|
|
</Link>
|
|
|
|
<Link href='/non-existing'>
|
|
|
|
<a style={linkStyle}>Non Existing Page</a>
|
|
|
|
</Link>
|
2018-08-12 02:39:48 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
<Component {...pageProps} />
|
|
|
|
</Container>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|