Merge pull request #161 from cher-ami/fix-langservice-hashhistory

Fix langServide to handle hashHistory

Added isHashHistory props to <Router> and to LangService option

README.md

@@ -426,7 +426,8 @@ Router component creates a new router instance.
   ,
   [MEMORY](https://github.com/ReactTraining/history/blob/master/docs/api-reference.md#creatememoryhistory)
   . For more information, check
-  the [history library documentation](https://github.com/ReactTraining/history/blob/master/docs/api-reference.md)
+  the [history library documentation](https://github.com/ReactTraining/history/blob/master/docs/api-reference.md) \
+- **isHashHistory** `boolean` _(optional)_ default `false`. If you use `HashHistory`, you must set `isHashHistory` to `true`
 - **staticLocation** `string` _(optional)_ use static URL location matching instead of history
 - **middlewares** `[]` _(optional)_ add routes middleware function to patch each routes)
 - **id** `?number | string` _(optional)_ id of the router instance - default : `1`
@@ -713,6 +714,7 @@ Array of :
 ### LangService
 
 Manage `:lang` params from anywhere inside Router scope.
+Add `isHashHistory` to `true` if you are using `createHashHistory()` for the router.
 
 ```jsx
 import { LangService } from "@cher-ami/router"
@@ -730,9 +732,15 @@ const langService = new LangService({
   languages,
   showDefaultLangInUrl: true,
   base,
+  //isHashHistory: true // Optional, only if history is hashHistory
 })
 
-;<Router langService={langService} routes={routesList} base={base}>
+;<Router
+  langService={langService}
+  routes={routesList}
+  base={base}
+  //isHashHistory={true} // Optional, only if history is hashHistory
+>
   <App />
 </Router>
 ```
@@ -772,6 +780,7 @@ constructor object properties:
 - `languages`: list on language objects
 - `showDefaultLangInUrl`: choose if default language is visible in URL or not
 - `base`: set the same than router base
+- `isHashHistory`: set to true if hashHistory is used (optional, default false)
 
 ```jsx
 const langService = new LangService({
@@ -824,6 +833,15 @@ Return langService init state
 const isInit = langService.isInit
 ```
 
+#### isHashHistory `boolean`
+
+Return isHashHistory state.
+
+```jsx
+const isHashHistory = langService.isHashHistory
+// true | false
+```
+
 #### setLang(toLang: TLanguage, forcePageReload = true) `void`
 
 Switch to another available language. This method can be called in nested router
@@ -898,6 +916,12 @@ Final routes array used by the router be
 
 Selected history mode. all history API is avaible from this one.
 
+#### Routers.isHashHistory
+
+`boolean`
+
+Return the value set on the Router component
+
 #### Routers.langService
 
 `LangService`

examples/example-client/src/index.tsx

@@ -4,15 +4,19 @@ import "./index.css"
 import App from "./App"
 import { Router, LangService } from "@cher-ami/router"
 import { routesList } from "./routes"
-import { createBrowserHistory } from "history"
+import { createBrowserHistory, createHashHistory } from "history"
 
-const base = "/base/"
+const base = "/"
 type TLang = "en" | "fr" | "de"
 
+const isHashHistory = true
+const history = isHashHistory ? createHashHistory() : createBrowserHistory()
+
 const langService = new LangService<TLang>({
   languages: [{ key: "en" }, { key: "fr" }, { key: "de" }],
   showDefaultLangInUrl: false,
   base,
+  isHashHistory,
 })
 
 /**
@@ -22,8 +26,9 @@ const root = createRoot(document.getElementById("root"))
 
 root.render(
   <Router
-    history={createBrowserHistory()}
+    history={history}
     langService={langService}
+    isHashHistory={isHashHistory}
     routes={routesList}
     base={base}
   >