RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-11 03:24:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

support mobile components

Browse Source
This commit is contained in:
SrGooglo 2022-11-22 00:34:50 +00:00
parent 59d00d4ad3
commit 55a9c80a74
1 changed files with 42 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
packages/app/src/router.jsx
View File

@ -5,26 +5,39 @@ const NotFoundRender = () => {
return <div>Not found</div> return <div>Not found</div>
} }
const DebugRoutes = import.meta.glob("/src/debug/components/**/[a-z[]*.jsx") const paths = {
const JSXRoutes = import.meta.glob("/src/pages/**/[a-z[]*.jsx") ...import.meta.glob("/src/debug/components/**/[a-z[]*.jsx"),
const TSXRoutes = import.meta.glob("/src/pages/**/[a-z[]*.tsx") ...import.meta.glob("/src/pages/**/[a-z[]*.jsx"),
...import.meta.glob("/src/pages/**/[a-z[]*.tsx"),
const scriptRoutes = {
...DebugRoutes,
...JSXRoutes,
...TSXRoutes,
} }
const routes = Object.keys(scriptRoutes).map((route) => { const pathsMobile = {
...import.meta.glob("/src/pages/**/[a-z[]*.mobile.jsx"),
...import.meta.glob("/src/pages/**/[a-z[]*.mobile.tsx"),
}
const routes = Object.keys(paths).map((route) => {
const path = route const path = route
.replace(/\/src\/pages|index|\.jsx$/g, "") .replace(/\/src\/pages|index|\.jsx$/g, "")
.replace(/\/src\/pages|index|\.tsx$/g, "")
.replace(/\/src\/debug\/components/g, "/debug") .replace(/\/src\/debug\/components/g, "/debug")
.replace(/\[\.{3}.+\]/, "*") .replace(/\[\.{3}.+\]/, "*")
.replace(/\[(.+)\]/, ":$1") .replace(/\[(.+)\]/, ":$1")
return { path, component: React.lazy(scriptRoutes[route]) } return { path, component: React.lazy(paths[route]) }
}) })
const mobileComponents = Object.fromEntries(Object.keys(pathsMobile).map((route) => {
const path = route
.replace(/\/src\/pages|index|\.mobile|\.jsx$/g, "")
.replace(/\/src\/pages|index|\.mobile|\.tsx$/g, "")
.replace(/\/src\/debug\/components/g, "/debug")
.replace(/\[\.{3}.+\]/, "*")
.replace(/\[(.+)\]/, ":$1")
return [path, React.lazy(pathsMobile[route])]
}))
export function BindContexts(component) { export function BindContexts(component) {
let contexts = { let contexts = {
main: {}, main: {},
@ -132,18 +145,29 @@ export const InternalRouter = (props) => {
export const PageRender = (props) => { export const PageRender = (props) => {
return <React.Suspense fallback={props.staticRenders?.PageLoad ? React.createElement(props.staticRenders?.PageLoad) : "Loading..."}> return <React.Suspense fallback={props.staticRenders?.PageLoad ? React.createElement(props.staticRenders?.PageLoad) : "Loading..."}>
<Switch> <Switch>
{routes.map(({ path, component: Component = React.Fragment }) => ( {routes.map(({ path, component: Component = React.Fragment }) => {
<Route if (window.isMobile) {
if (mobileComponents[path]) {
Component = mobileComponents[path]
} else {
console.warn(`No mobile component for ${path}, using default`)
}
}
const generateRenderComponent = (props) => {
return React.createElement(BindContexts(Component), {
...props,
history: props.history,
})
}
return <Route
key={path} key={path}
path={path} path={path}
component={(_props) => React.createElement(BindContexts(Component), { component={generateRenderComponent}
...props,
..._props,
history: props.history,
})}
exact={true} exact={true}
/> />
))} })}
<Route path="*" component={props.staticRenders?.NotFound ?? NotFoundRender} /> <Route path="*" component={props.staticRenders?.NotFound ?? NotFoundRender} />
</Switch> </Switch>
</React.Suspense> </React.Suspense>