Refactor component name to be number also (#4326)

Refactor component name to be number also

lib/src/Navigation.ts

@@ -56,7 +56,8 @@ export class Navigation {
    * Every navigation component in your app must be registered with a unique name.
    * The component itself is a traditional React component extending React.Component.
    */
-  public registerComponent(componentName: string, getComponentClassFunc: ComponentProvider): ComponentProvider {
+
+  public registerComponent(componentName: string | number, getComponentClassFunc: ComponentProvider): ComponentProvider {
     return this.componentRegistry.registerComponent(componentName, getComponentClassFunc);
   }
 
@@ -65,7 +66,7 @@ export class Navigation {
    * wraps the provided component with a react-redux Provider with the passed redux store
    */
   public registerComponentWithRedux(
-    componentName: string,
+    componentName: string | number,
     getComponentClassFunc: ComponentProvider,
     ReduxProvider: any,
     reduxStore: any

lib/src/components/ComponentRegistry.ts

@@ -6,12 +6,12 @@ import { ComponentEventsObserver } from '../events/ComponentEventsObserver';
 export class ComponentRegistry {
   constructor(private readonly store: Store, private readonly componentEventsObserver: ComponentEventsObserver, private readonly ComponentWrapperClass: typeof ComponentWrapper) { }
 
-  registerComponent(componentName: string, getComponentClassFunc: ComponentProvider, ReduxProvider?: any, reduxStore?: any): ComponentProvider {
+  registerComponent(componentName: string | number, getComponentClassFunc: ComponentProvider, ReduxProvider?: any, reduxStore?: any): ComponentProvider {
     const NavigationComponent = () => {
-      return this.ComponentWrapperClass.wrap(componentName, getComponentClassFunc, this.store, this.componentEventsObserver, ReduxProvider, reduxStore)
+      return this.ComponentWrapperClass.wrap(componentName.toString(), getComponentClassFunc, this.store, this.componentEventsObserver, ReduxProvider, reduxStore)
     };
-    this.store.setComponentClassForName(componentName, NavigationComponent);
-    AppRegistry.registerComponent(componentName, NavigationComponent);
+    this.store.setComponentClassForName(componentName.toString(), NavigationComponent);
+    AppRegistry.registerComponent(componentName.toString(), NavigationComponent);
     return NavigationComponent;
   }
 }

lib/src/components/ComponentWrapper.tsx

@@ -10,7 +10,7 @@ interface HocProps { componentId: string; }
 
 export class ComponentWrapper {
   static wrap(
-    componentName: string,
+    componentName: string | number,
     OriginalComponentGenerator: ComponentProvider,
     store: Store,
     componentEventsObserver: ComponentEventsObserver,

lib/src/components/Store.ts

@@ -12,12 +12,13 @@ export class Store {
     return _.get(this.propsById, componentId, {});
   }
 
-  setComponentClassForName(componentName: string, ComponentClass) {
-    _.set(this.componentsByName, componentName, ComponentClass);
+
+  setComponentClassForName(componentName: string | number, ComponentClass) {
+    _.set(this.componentsByName, componentName.toString(), ComponentClass);
   }
 
-  getComponentClassForName(componentName: string) {
-    return _.get(this.componentsByName, componentName);
+  getComponentClassForName(componentName: string | number) {
+    return _.get(this.componentsByName, componentName.toString());
   }
   
   cleanId(id: string) {