Combine app.tsx with main.tsx
This commit is contained in:
39
src/App.tsx
39
src/App.tsx
@@ -1,39 +0,0 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import './App.scss'
|
||||
import Sidebar from './componets/Sidebar'
|
||||
import Settings from './routes/Settings'
|
||||
import Installs from './routes/Installs'
|
||||
|
||||
export default function App () {
|
||||
const [hash, setHash] = useState(window.location.hash || '#installs')
|
||||
|
||||
useEffect(() => {
|
||||
const onHashChange = () => setHash(window.location.hash || '#installs')
|
||||
window.addEventListener('hashchange', onHashChange)
|
||||
return () => window.removeEventListener('hashchange', onHashChange)
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
const handler = (e: MouseEvent) => e.preventDefault()
|
||||
document.addEventListener('contextmenu', handler)
|
||||
return () => document.removeEventListener('contextmenu', handler)
|
||||
}, [])
|
||||
|
||||
function renderContent() {
|
||||
if (hash === "#installs") {
|
||||
return <Installs />
|
||||
} else if (hash === "#settings") {
|
||||
return <Settings />
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Sidebar />
|
||||
<main style={{ marginLeft: '15rem' }}>
|
||||
{renderContent()}
|
||||
</main>
|
||||
</>
|
||||
)
|
||||
}
|
||||
41
src/main.tsx
41
src/main.tsx
@@ -1,6 +1,43 @@
|
||||
import React from 'react'
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App'
|
||||
import Installs from './routes/Installs'
|
||||
import Settings from './routes/Settings'
|
||||
import Sidebar from './componets/Sidebar'
|
||||
import './Globals.scss'
|
||||
|
||||
function App () {
|
||||
const [hash, setHash] = useState(window.location.hash || '#installs')
|
||||
|
||||
useEffect(() => {
|
||||
const onHashChange = () => setHash(window.location.hash || '#installs')
|
||||
window.addEventListener('hashchange', onHashChange)
|
||||
return () => window.removeEventListener('hashchange', onHashChange)
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
const handler = (e: MouseEvent) => e.preventDefault()
|
||||
document.addEventListener('contextmenu', handler)
|
||||
return () => document.removeEventListener('contextmenu', handler)
|
||||
}, [])
|
||||
|
||||
function renderContent() {
|
||||
if (hash === "#installs") {
|
||||
return <Installs />
|
||||
} else if (hash === "#settings") {
|
||||
return <Settings />
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Sidebar />
|
||||
<main style={{ marginLeft: '15rem' }}>
|
||||
{renderContent()}
|
||||
</main>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
|
||||
<React.StrictMode>
|
||||
|
||||
Reference in New Issue
Block a user