69 lines
1.4 KiB
JavaScript
69 lines
1.4 KiB
JavaScript
import React, { PureComponent } from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import { Router, Location } from '@reach/router'
|
|
import { webFrame } from 'electron'
|
|
import posed, { PoseGroup } from 'react-pose'
|
|
import AppProvider from './store/AppProvider'
|
|
import Titlebar from './components/Titlebar'
|
|
import Home from './screens/Home'
|
|
import Preferences from './screens/Preferences'
|
|
import './App.css'
|
|
|
|
//
|
|
// Disable zooming
|
|
//
|
|
webFrame.setVisualZoomLevelLimits(1, 1)
|
|
webFrame.setLayoutZoomLevelLimits(0, 0)
|
|
|
|
const Animation = posed.div({
|
|
enter: {
|
|
y: 0,
|
|
opacity: 1,
|
|
delay: 100,
|
|
transition: {
|
|
type: 'spring',
|
|
stiffness: 500,
|
|
damping: 25,
|
|
restDelta: 0.5,
|
|
restSpeed: 10
|
|
}
|
|
},
|
|
exit: {
|
|
y: 50,
|
|
opacity: 0,
|
|
transition: { duration: 150 }
|
|
}
|
|
})
|
|
|
|
const PosedRouter = ({ children }) => (
|
|
<Location>
|
|
{({ location }) => (
|
|
<PoseGroup>
|
|
<Animation key={location.key}>
|
|
<Router location={location}>{children}</Router>
|
|
</Animation>
|
|
</PoseGroup>
|
|
)}
|
|
</Location>
|
|
)
|
|
|
|
PosedRouter.propTypes = {
|
|
children: PropTypes.any.isRequired
|
|
}
|
|
|
|
export default class App extends PureComponent {
|
|
render() {
|
|
return (
|
|
<AppProvider>
|
|
<Titlebar />
|
|
<div className="app">
|
|
<PosedRouter>
|
|
<Home path="/" default />
|
|
<Preferences path="/preferences" />
|
|
</PosedRouter>
|
|
</div>
|
|
</AppProvider>
|
|
)
|
|
}
|
|
}
|