forked from cubetiq/cubetiq-react-app
Task: Add router and routes config and authority route and add types to be router
This commit is contained in:
parent
4c0fe442cd
commit
371b4fad15
@ -1,6 +1,6 @@
|
||||
{
|
||||
"trailingComma": "es5",
|
||||
"tabWidth": 2,
|
||||
"tabWidth": 4,
|
||||
"semi": false,
|
||||
"singleQuote": true
|
||||
}
|
||||
|
@ -51,6 +51,7 @@
|
||||
"@types/node": "^12.0.0",
|
||||
"@types/react": "^17.0.0",
|
||||
"@types/react-dom": "^17.0.0",
|
||||
"@types/react-router-dom": "^5.1.7",
|
||||
"craco-less": "^1.17.1",
|
||||
"prettier": "^2.3.1",
|
||||
"react-scripts": "4.0.3",
|
||||
|
@ -1,11 +1,10 @@
|
||||
import React from 'react'
|
||||
import RouterView from '../routes'
|
||||
import './App.css'
|
||||
|
||||
const App = () => {
|
||||
return (
|
||||
<div className="App">
|
||||
<h1>CUBETIQ</h1>
|
||||
</div>
|
||||
<RouterView />
|
||||
)
|
||||
}
|
||||
|
||||
|
3
src/config/index.ts
Normal file
3
src/config/index.ts
Normal file
@ -0,0 +1,3 @@
|
||||
export const AppConfig = {
|
||||
APP_NAME: process.env.REACT_APP_NAME
|
||||
}
|
@ -1,7 +1,26 @@
|
||||
import React from 'react'
|
||||
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'
|
||||
import { routes } from './routes'
|
||||
|
||||
const RouterView = () => {
|
||||
return <>Router</>
|
||||
return (
|
||||
<Router>
|
||||
<Switch>
|
||||
{routes.map((route) => {
|
||||
return (
|
||||
<Route
|
||||
key={route.key}
|
||||
exact={route.exact}
|
||||
component={route.component}
|
||||
children={route.children}
|
||||
location={route.location}
|
||||
path={route.path}
|
||||
/>
|
||||
)
|
||||
})}
|
||||
</Switch>
|
||||
</Router>
|
||||
)
|
||||
}
|
||||
|
||||
export default RouterView
|
||||
|
@ -1 +0,0 @@
|
||||
export const routes: Array<any> = []
|
49
src/routes/routes.tsx
Normal file
49
src/routes/routes.tsx
Normal file
@ -0,0 +1,49 @@
|
||||
import { RouteProps } from 'react-router-dom'
|
||||
import About from '../pages/About'
|
||||
import Home from '../pages/Home'
|
||||
import RouteTypes from './types'
|
||||
|
||||
interface Authority {
|
||||
authority?: string | undefined
|
||||
strict?: boolean | undefined
|
||||
with?: Authority | undefined
|
||||
}
|
||||
|
||||
interface AuthorityProps {
|
||||
authorities?: Authority | string[] | string | undefined
|
||||
strictAuthority?: boolean | undefined
|
||||
}
|
||||
|
||||
interface CustomRouteProps extends RouteProps, AuthorityProps {
|
||||
key: string
|
||||
}
|
||||
|
||||
export interface MenuProps {
|
||||
icon: any
|
||||
label?: string | undefined
|
||||
}
|
||||
|
||||
export interface SideMenuRouteProps extends CustomRouteProps, MenuProps {}
|
||||
|
||||
export interface SideSubMenuProps extends MenuProps {
|
||||
key?: string | undefined
|
||||
subMenus: SideSubMenuProps[]
|
||||
}
|
||||
|
||||
const routes: CustomRouteProps[] = [
|
||||
{
|
||||
key: 'home',
|
||||
exact: true,
|
||||
path: RouteTypes.HOME,
|
||||
component: () => <Home />,
|
||||
},
|
||||
{
|
||||
key: 'about',
|
||||
path: RouteTypes.ABOUT,
|
||||
component: () => <About />,
|
||||
},
|
||||
]
|
||||
|
||||
const menus: (SideMenuRouteProps | SideSubMenuProps)[] = []
|
||||
|
||||
export { routes, menus }
|
6
src/routes/types.ts
Normal file
6
src/routes/types.ts
Normal file
@ -0,0 +1,6 @@
|
||||
const RouteTypes = {
|
||||
HOME: "/",
|
||||
ABOUT: "/about",
|
||||
}
|
||||
|
||||
export default RouteTypes
|
Loading…
Reference in New Issue
Block a user