Hi all, I have been working on $Subject. While working on it we came across the following requirement.
In the previous store implementation the tenant domain is passed on the url as a query param and when either the page is refresh or if the url is directly accessed with the query param tenant specific details are loaded. However in the current react based single page implementation all the routing is handle via react router. Here if we initially plan on keeping the tenant domain in the react context api as a global setting. Once the app is loaded routing can be handled easily by taking the tenant domain from the context api. The problem is when the app is refreshed or if a url is visited directly, at this occasion the context api is empty and the user will always be redirect to the tenant listing. To handle this issue after considering some input from the react community [1] , we came up with the solution of writing an interceptor for the react router. This would require us to extend the currently react router implementation and its history implementation to plugin our custom interceptor. An advantage of the interceptor approach is that this saves the developer the hassle handling both tenant and normal cases each and every route path already added and paths to be added in the future. The flow will be as follows. When the store is initially loaded react router should be initialized [2]. Rather than using the default Router component by react router we will be using our custom component BrowserRouter [3]. In this we place the interceptor to be invoked when we are navigating around (push or replace) [4]. The interceptor [5] will take the tenant domain from the context and append it to the path. So in each route (when the user navigates to different pages this will be appended as a query param. To retrieve the tenant specific data from the REST API , we will be getting the tenant domain from the query param and setting it to the x-wso2-tenant header [6]. Any thoughts and feedback on this much appreciated. [1] - https://stackoverflow.com/questions/57757263/how-to-write-an-interceptor-for-react-router/57757921#57757921 [2] - https://github.com/dushansilva/carbon-apimgt/blob/5603333b774c10b74c2709c6bf5b9c6ac20ccca6/features/apimgt/org.wso2.carbon.apimgt.store.feature/src/main/resources/store-new/source/src/App.jsx#L96 [3] - https://github.com/dushansilva/carbon-apimgt/blob/5603333b774c10b74c2709c6bf5b9c6ac20ccca6/features/apimgt/org.wso2.carbon.apimgt.store.feature/src/main/resources/store-new/source/src/app/CustomRouter/BrowserRouter.jsx#L15 [4] - https://github.com/dushansilva/carbon-apimgt/blob/5603333b774c10b74c2709c6bf5b9c6ac20ccca6/features/apimgt/org.wso2.carbon.apimgt.store.feature/src/main/resources/store-new/source/src/app/CustomRouter/BrowserRouter.jsx#L28 [5] - https://github.com/dushansilva/carbon-apimgt/blob/5603333b774c10b74c2709c6bf5b9c6ac20ccca6/features/apimgt/org.wso2.carbon.apimgt.store.feature/src/main/resources/store-new/source/src/app/CustomRouter/BrowserRouter.jsx#L43 [6] - https://github.com/dushansilva/carbon-apimgt/blob/5603333b774c10b74c2709c6bf5b9c6ac20ccca6/features/apimgt/org.wso2.carbon.apimgt.store.feature/src/main/resources/store-new/source/src/app/data/APIClient.jsx#L163 -- Best Regards Dushan Silva Software Engineer *WSO2, Inc. * lean . enterprise . middleware Mob: +94 774 979042
_______________________________________________ Architecture mailing list [email protected] https://mail.wso2.org/cgi-bin/mailman/listinfo/architecture
