chore(react): updating types for location state to fix type errors (#…

…20206)
ionic-team · Jan 14, 2020 · 22f9229 · 22f9229
1 parent ad8f3db
commit 22f9229
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 7 deletions.
diff --git a/packages/react-router/src/ReactRouter/IonReactMemoryRouter.tsx b/packages/react-router/src/ReactRouter/IonReactMemoryRouter.tsx
@@ -2,10 +2,10 @@ import { MemoryHistory } from 'history';
 import React from 'react';
 import { MemoryRouter, MemoryRouterProps, matchPath } from 'react-router';
 
-import { RouteManager } from './Router';
+import { LocationState, RouteManager } from './Router';
 
 interface IonReactMemoryRouterProps extends MemoryRouterProps {
-  history: MemoryHistory;
+  history: MemoryHistory<LocationState>;
 }
 
 export class IonReactMemoryRouter extends React.Component<IonReactMemoryRouterProps> {

diff --git a/packages/react-router/src/ReactRouter/Router.tsx b/packages/react-router/src/ReactRouter/Router.tsx
@@ -14,12 +14,21 @@ import { RouteManagerContext, RouteManagerContextState } from './RouteManagerCon
 import { ViewItem } from './ViewItem';
 import { ViewStack, ViewStacks } from './ViewStacks';
 
+export interface LocationState {
+  direction?: RouterDirection;
+  action?: IonRouteAction;
+}
+
+interface RouteManagerProps extends RouteComponentProps<{}, {}, LocationState> {
+  location: HistoryLocation<LocationState>;
+}
+
 interface RouteManagerState extends RouteManagerContextState {
-  location?: HistoryLocation;
+  location?: HistoryLocation<LocationState>;
   action?: IonRouteAction;
 }
 
-export class RouteManager extends React.Component<RouteComponentProps, RouteManagerState> {
+export class RouteManager extends React.Component<RouteManagerProps, RouteManagerState> {
   listenUnregisterCallback: UnregisterCallback | undefined;
   activeIonPageId?: string;
   currentIonRouteAction?: IonRouteAction;
@@ -30,7 +39,7 @@ export class RouteManager extends React.Component<RouteComponentProps, RouteMana
   routerOutlets: { [key: string]: HTMLIonRouterOutletElement; } = {};
   firstRender = true;
 
-  constructor(props: RouteComponentProps) {
+  constructor(props: RouteManagerProps) {
     super(props);
     this.listenUnregisterCallback = this.props.history.listen(this.historyChange.bind(this));
     this.handleNavigate = this.handleNavigate.bind(this);
@@ -87,7 +96,7 @@ export class RouteManager extends React.Component<RouteComponentProps, RouteMana
     }
   }
 
-  historyChange(location: HistoryLocation, action: HistoryAction) {
+  historyChange(location: HistoryLocation<LocationState>, action: HistoryAction) {
     const ionRouteAction = this.currentIonRouteAction === 'pop' ? 'pop' : action.toLowerCase() as IonRouteAction;
     let direction = this.currentRouteDirection;
 
@@ -115,7 +124,7 @@ export class RouteManager extends React.Component<RouteComponentProps, RouteMana
     this.currentIonRouteAction = undefined;
   }
 
-  setActiveView(location: HistoryLocation, action: IonRouteAction, viewStacks: ViewStacks) {
+  setActiveView(location: HistoryLocation<LocationState>, action: IonRouteAction, viewStacks: ViewStacks) {
     let direction: RouterDirection | undefined = (location.state && location.state.direction) || 'forward';
     let leavingView: ViewItem | undefined;
     const viewStackKeys = viewStacks.getKeys();