init

src/__data__/urls.ts

@@ -0,0 +1,17 @@
+import { getNavigations, getNavigationsValue } from '@brojs/cli'
+
+import pkg from '../../package.json'
+
+const baseUrl = getNavigationsValue(`${pkg.name}.main`)
+const navs = getNavigations()
+const makeUrl = (url) => baseUrl + url
+
+export const URLs = {
+  baseUrl,
+  by: {
+    url: makeUrl(navs[`link.${pkg.name}.by`]),
+  },
+  toNotFound: {
+    url: makeUrl('/404'),
+  }
+}

src/app.tsx

@@ -0,0 +1,17 @@
+import React from 'react'
+import { BrowserRouter } from 'react-router-dom'
+import { ChakraProvider } from '@chakra-ui/react'
+
+import { Dashboard } from './dashboard'
+
+const App = () => {
+  return (
+    <ChakraProvider>
+      <BrowserRouter>
+        <Dashboard />
+      </BrowserRouter>
+    </ChakraProvider>
+  )
+}
+
+export default App

src/dashboard.tsx

@@ -0,0 +1,20 @@
+import React from 'react'
+import { Navigate, Route, Routes } from 'react-router-dom'
+
+import { URLs } from './__data__/urls'
+
+import { NotFound } from './pages/not-found'
+import { ByPage } from './pages/by'
+
+export const Dashboard = () => {
+  return (
+    <Routes>
+      <Route
+        path={URLs.baseUrl}
+        element={<Navigate replace to={URLs.toNotFound.url} />}
+      />
+      <Route path={URLs.by.url} element={<ByPage />} />
+      <Route path="*" element={<NotFound />} />
+    </Routes>
+  )
+}

src/index.tsx

@@ -0,0 +1,25 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable react/display-name */
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+  
+import App from './app'
+  
+export default () => <App/>
+  
+let rootElement: ReactDOM.Root
+  
+export const mount = (Сomponent, element = document.getElementById('app')) => {
+  rootElement = ReactDOM.createRoot(element)
+  rootElement.render(<Сomponent/>)
+
+  if(module.hot) {
+    module.hot.accept('./app', ()=> {
+      rootElement.render(<Сomponent/>)
+    })
+  }
+}
+
+export const unmount = () => {
+  rootElement.unmount()
+}

src/pages/by.tsx

@@ -0,0 +1,13 @@
+import { Container } from '@chakra-ui/react'
+import React from 'react'
+import { useParams } from 'react-router-dom'
+
+export const ByPage = () => {
+  const params = useParams()
+
+  return (
+    <Container maxW="container.xl">
+      <pre>{JSON.stringify(params, null, 4)}</pre>
+    </Container>
+  )
+}

src/pages/not-found.tsx

@@ -0,0 +1,11 @@
+import { Container } from '@chakra-ui/react'
+import Lottie from "lottie-react"
+import React from 'react'
+
+import notFoundAnim from '../assets/lottie/404.json'
+
+export const NotFound = () => (
+  <Container maxW="container.xl">
+    <Lottie animationData={notFoundAnim} />
+  </Container >
+)