66 lines
1.6 KiB
JavaScript
66 lines
1.6 KiB
JavaScript
import React, { useEffect } from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import {
|
|
Router,
|
|
createMemorySource,
|
|
createHistory,
|
|
LocationProvider,
|
|
navigate
|
|
} from '@reach/router'
|
|
import { webFrame, ipcRenderer } from 'electron'
|
|
import posed, { PoseGroup } from 'react-pose'
|
|
import Titlebar from './components/Titlebar'
|
|
import { defaultAnimation } from './components/Animations'
|
|
import Home from './screens/Home'
|
|
import Preferences from './screens/Preferences'
|
|
import styles from './App.module.css'
|
|
|
|
//
|
|
// Disable zooming
|
|
//
|
|
webFrame.setVisualZoomLevelLimits(1, 1)
|
|
webFrame.setLayoutZoomLevelLimits(0, 0)
|
|
|
|
const Animation = posed.div(defaultAnimation)
|
|
|
|
// Fix reach-router in packaged Electron
|
|
// https://github.com/reach/router/issues/25#issuecomment-394003652
|
|
let source = createMemorySource('/')
|
|
let history = createHistory(source)
|
|
|
|
const PosedRouter = ({ children }) => (
|
|
<LocationProvider history={history}>
|
|
{({ location }) => (
|
|
<PoseGroup animateOnMount>
|
|
<Animation key={location.key}>
|
|
<Router location={location}>{children}</Router>
|
|
</Animation>
|
|
</PoseGroup>
|
|
)}
|
|
</LocationProvider>
|
|
)
|
|
|
|
PosedRouter.propTypes = {
|
|
children: PropTypes.any.isRequired
|
|
}
|
|
|
|
export default function App() {
|
|
useEffect(() => {
|
|
ipcRenderer.on('goTo', (evt, route) => {
|
|
navigate(route)
|
|
})
|
|
}, [])
|
|
|
|
return (
|
|
<>
|
|
{process.platform === 'darwin' && <Titlebar />}
|
|
<div className={styles.app}>
|
|
<PosedRouter>
|
|
<Home path="/" default />
|
|
<Preferences path="/preferences" />
|
|
</PosedRouter>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|