diff --git a/lib/alem-vm/alem-vm.d.ts b/lib/alem-vm/alem-vm.d.ts index 43ce023..5a88400 100644 --- a/lib/alem-vm/alem-vm.d.ts +++ b/lib/alem-vm/alem-vm.d.ts @@ -87,16 +87,6 @@ type LinkProps = { params?: Record; }; -type URLRouterProps = { - routes: Route[]; - /** - * Parameter name to store current route name. Default is "path". - */ - parameterName?: string; -}; - -export declare const SimpleRouter: (props: URLRouterProps) => JSX.Element; - /** * Link to access routes. */ @@ -185,7 +175,6 @@ export type UseRoutesProps = { routeParameterName: string; routes: string[]; routeType: string; - routeBlocked: boolean; routeParams: Record; history: string[]; }; diff --git a/lib/alem-vm/importable/RouteLink.tsx b/lib/alem-vm/importable/RouteLink.tsx index cf537ef..0e723dd 100644 --- a/lib/alem-vm/importable/RouteLink.tsx +++ b/lib/alem-vm/importable/RouteLink.tsx @@ -1,7 +1,3 @@ -// NOTA: Arquivo original antes da descoberta e uso do `Link` -// `Link` não está sendo usado pois falha quando se tentar voltar ou ir pra frente -// usando os botoes do navegador - import { LinkProps, navigate, useContext } from "../alem-vm"; /** @@ -45,8 +41,11 @@ export const RouteLink = ({ }); } + // Evita o refresh da pagina + const Link = styled("Link")``; + return ( - {label || children} - + ); } diff --git a/lib/alem-vm/importable/Router.tsx b/lib/alem-vm/importable/Router.tsx index fabf3af..f212cbf 100644 --- a/lib/alem-vm/importable/Router.tsx +++ b/lib/alem-vm/importable/Router.tsx @@ -47,6 +47,24 @@ const Router = (props: RouterProps) => { const { routeParameterName, routeType, activeRoute } = alemRoutes; const routeParamName = parameterName || routeParameterName; + // Registra como listener das props do root + useEffect(() => { + const handler = (data: any) => { + const _type = type || "URLBased"; + if (_type === "URLBased") { + alemRoutes.updateRouteParameters({ + activeRoute: data[routeParamName], + }); + } + }; + + alem.registerListenerHandler(handler); + + return () => { + alem.unregisterListenerHandler(); + }; + }, []); + const checkIfPathIsIncludedToRoutes = (routePath: string) => { let pathFound = false; if (routes) { @@ -65,10 +83,6 @@ const Router = (props: RouterProps) => { // BOS.props const bosProps = alem.rootProps; - // ContentBased config only: should maintain the current route over refreshes? - const maintainRoutesWhenDeveloping = - alem.isDevelopment && alem.alemConfig_maintainRouteWhenDeveloping; - if (routes) { // Check if currentUrlPath exists in the routes list, if not, use // the first element's path @@ -85,14 +99,6 @@ const Router = (props: RouterProps) => { let _activeRoute = initialRoute || alemRoutes.activeRoute || currentUrlPath; - if ( - !(currentUrlPath && routeType == "URLBased" && alemRoutes.routeBlocked) - ) { - _activeRoute = maintainRoutesWhenDeveloping - ? initialRoute || activeRoute - : routes[0].path; - } - // Checa se o config.keepRoute esta ativado e se tiver, se tem uma rota salva let _activeRouteParams = null; let _history = null; @@ -119,7 +125,6 @@ const Router = (props: RouterProps) => { activeRoute: _activeRoute, routeParams: _activeRouteParams, history: _history, - routeBlocked: true, routeParameterName: routeParamName, }); } diff --git a/lib/alem-vm/importable/RouterContext.ts b/lib/alem-vm/importable/RouterContext.ts index 9c80afb..ce63ea5 100644 --- a/lib/alem-vm/importable/RouterContext.ts +++ b/lib/alem-vm/importable/RouterContext.ts @@ -10,7 +10,9 @@ import { const ALEM_ROUTES_CONTEXT_KEY = "alemRoutes"; const RouterContext = () => { - const { setDefaultData, updateData } = createContext(ALEM_ROUTES_CONTEXT_KEY); + const { setDefaultData, updateData, getSelf } = createContext( + ALEM_ROUTES_CONTEXT_KEY, + ); /** * Update the alem state @@ -37,7 +39,6 @@ const RouterContext = () => { routeParameterName: "path", routes: [] as string[], routeType: "URLBased", // URLBased | ContentBased - routeBlocked: true, // Used to force navigate to other paths even when the "path=" parameter is present into the URL // ==================================== Routes - Methods ==================================== @@ -48,7 +49,6 @@ const RouterContext = () => { routes?: string[]; routeType?: RouteType; activeRoute?: string; - routeBlocked?: boolean; routeParams?: Record; history?: History[]; // Previous history if config.keepRoute is true routeParameterName?: string; @@ -79,13 +79,12 @@ const RouterContext = () => { } updateAlemRoutesState({ - routes: routeProps.routes || alemRoutesState().routes, - routeType: routeProps.routeType || alemRoutesState().routeType, - activeRoute: routeProps.activeRoute || alemRoutesState().activeRoute, - routeBlocked: routeProps.routeBlocked || alemRoutesState().routeBlocked, - routeParams: routeProps.routeParams || alemRoutesState().routeParams, + routes: routeProps.routes || getSelf().routes, + routeType: routeProps.routeType || getSelf().routeType, + activeRoute: routeProps.activeRoute || getSelf().activeRoute, + routeParams: routeProps.routeParams || getSelf().routeParams, routeParameterName: - routeProps.routeParameterName || alemRoutesState().routeParameterName, + routeProps.routeParameterName || getSelf().routeParameterName, history: updatedHistory, routesInitialized: true, }); diff --git a/lib/alem-vm/importable/SimpleRouter.tsx b/lib/alem-vm/importable/SimpleRouter.tsx deleted file mode 100644 index c558d14..0000000 --- a/lib/alem-vm/importable/SimpleRouter.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import { Route, props } from "../alem-vm"; - -type URLRouterProps = { - routes: Route[]; - /** - * Parameter name to store current route name. Default is "path". - */ - parameterName?: string; -}; - -/** - * Init routes using simple Router system where it will render content - * based on the router path. - * @param props - * @returns - */ -const SimpleRouter = ({ routes, parameterName }: URLRouterProps) => { - // Checa se sao rotas validas - routes.forEach((route) => { - if (!route.component) { - console.error(`Routes: Invalid component for route "${route.path}"`); - } - - if (!route.path) { - console.error("Routes: Invalid path:", route.path); - } - }); - - // BOS.props - const bosProps: Record = props.alem.rootProps || {}; - const activeRoute = bosProps[parameterName || "path"] || routes[0].path; - - const Component = routes.find((route: Route) => route.path === activeRoute) - ?.component || - routes[0].component || <>; - - return ; -}; - -export default SimpleRouter; diff --git a/lib/alem-vm/importable/navigate.ts b/lib/alem-vm/importable/navigate.ts index 3d1ad94..0fcf12e 100644 --- a/lib/alem-vm/importable/navigate.ts +++ b/lib/alem-vm/importable/navigate.ts @@ -1,4 +1,4 @@ -import { useContext } from "../alem-vm"; +import { isDevelopment, useContext } from "../alem-vm"; const navigate = { /** @@ -12,6 +12,12 @@ const navigate = { console.error("navigate is being used without Router on top of it."); } + if (isDevelopment && routeContext.routeType === "URLBased") { + console.warn( + 'The route type is "URLBased", "navigate" should only be used with the "ContentBased" type.', + ); + } + if (routeContext.routes.includes(route)) { // Precia enviar toda a estrura ja existente e atualizar somente o recurso desejado. // Isso se deve devido a quando se altera um state, o componente onde ele está é @@ -34,6 +40,12 @@ const navigate = { console.error("navigate is being used without Router on top of it."); } + if (isDevelopment && routeContext.routeType === "URLBased") { + console.warn( + 'The route type is "URLBased", "navigate" should only be used with the "ContentBased" type.', + ); + } + const updatedHistory = routeContext.history; if (updatedHistory) { updatedHistory.pop(); diff --git a/lib/alem-vm/state.ts b/lib/alem-vm/state.ts index 3ea0645..aecb037 100644 --- a/lib/alem-vm/state.ts +++ b/lib/alem-vm/state.ts @@ -25,6 +25,19 @@ const alemState = () => state.alem as typeof AlemStateInitialBody.alem; const AlemStateInitialBody = { alem: { + // System to send root properties to listeners + rootPropsListeners: [], + registerListenerHandler: (handler: (data: any) => void) => { + if (!props.alem.rootPropsListeners.includes(handler)) { + props.alem.rootPropsListeners.push(handler); + } + }, + unregisterListenerHandler: (handler: (data: any) => void) => { + props.alem.rootPropsListeners = props.alem.rootPropsListeners.filter( + (item) => item !== handler, + ); + }, + ready: false, /** * Root project props @@ -212,6 +225,10 @@ if (props.alem.keepRoute) { }); } +// Chama todos os metodos guardados no alem.handlers quando a propriedade +// do root mudar +props.alem.rootPropsListeners.forEach((handler) => handler(props)); + export type Alem = any; // TODO: (Store -> Ser usar persistencia) Load previous store diff --git a/lib/config/importableAlemFileSchemas.js b/lib/config/importableAlemFileSchemas.js index fa4f946..9aaa53a 100644 --- a/lib/config/importableAlemFileSchemas.js +++ b/lib/config/importableAlemFileSchemas.js @@ -60,16 +60,6 @@ const importableAlemFileSchemas = () => { path.join(__dirname, "../", ALEM_VM_FOLDER, "importable", "getLocation.ts"), ); - const simpleRouterSchema = transformFileToFileSchema( - path.join( - __dirname, - "../", - ALEM_VM_FOLDER, - "importable", - "SimpleRouter.tsx", - ), - ); - const createDebounceSchema = transformFileToFileSchema( path.join( __dirname, @@ -117,7 +107,6 @@ const importableAlemFileSchemas = () => { routeLinkSchema, useRoutesSchema, getLocationSchema, - simpleRouterSchema, createDebounceSchema, navigateSchema, modulesContextSchema, diff --git a/lib/config/importableFiles.js b/lib/config/importableFiles.js index a91f2b3..3a50d79 100644 --- a/lib/config/importableFiles.js +++ b/lib/config/importableFiles.js @@ -74,14 +74,6 @@ const getLocation = path.join( "getLocation.ts", ); -const SimpleRouter = path.join( - __dirname, - "../", - ALEM_VM_FOLDER, - "importable", - "SimpleRouter.tsx", -); - const createDebounce = path.join( __dirname, "../", @@ -133,7 +125,6 @@ module.exports = { RouteLink, useRoutes, getLocation, - SimpleRouter, createDebounce, navigate, ModulesContext,