How to use the @react-navigation/core.createNavigator function in @react-navigation/core

function createStackNavigator(routeConfigMap, stackConfig = {}) {
  const router = StackRouter(routeConfigMap, stackConfig);

  // Create a navigator with StackView as the view
  let Navigator = createNavigator(StackView, router, stackConfig);
  // if (!stackConfig.disableKeyboardHandling) {
  //   Navigator = createKeyboardAwareNavigator(Navigator, stackConfig);
  // }

  return Navigator;
}

const Settings = require('./').default
    return (
      <Kb.Box2 direction="horizontal" fullHeight={true} fullWidth={true}>
        <Settings routeSelected={descriptor.state.routeName}>
          <SceneView
            navigation={childNav}
            component={descriptor.getComponent()}
            screenProps={this.props.screenProps || noScreenProps}
          />
        </Settings>
      </Kb.Box2>
    )
  }
}
const SettingsSubNavigator = createNavigator(
  SettingsSubNav,
  StackRouter(Shim.shim(settingsSubRoutes), {initialRouteName: Constants.accountTab}),
  {}
)

SettingsSubNavigator.navigationOptions = {
  title: 'Settings',
}

export const newRoutes = {
  // MUST use screen and not getScreen for subnavs!
  settingsRoot: {screen: SettingsSubNavigator},
}
export const newModalRoutes = {
  [Constants.logOutTab]: {getScreen: (): typeof LogOutTab => require('./logout/container').default},
  // TODO connect broken

return (
      <Kb.Box2 direction="horizontal" fullHeight={true} fullWidth={true}>
        <TabBar selectedTab={selectedTab} />
        <Kb.Box2
          direction={direction}
          fullHeight={true}
          style={selectedTab ? styles.contentArea : styles.contentAreaLogin}
        >
          {scene}
          <Header options={descriptor.options} onPop={() => childNav.pop()} allowBack={index !== 0} />
        </Kb.Box2>
      </Kb.Box2>
    )
  }
}
const MainNavigator = createNavigator(
  AppView,
  StackRouter(Shim.shim(routes), {initialRouteName: 'tabs.peopleTab'}),
  {}
)

class ModalView extends React.PureComponent<any> {
  render() {
    const navigation = this.props.navigation
    const index = navigation.state.index
    const activeKey = navigation.state.routes[index].key
    const descriptor = this.props.descriptors[activeKey]
    const childNav = descriptor.navigation

    // We render the app below us
    const appKey = this.props.navigation.state.routes[0].key
    const appNav = this.props.navigation.getChildNavigation(appKey)

function createStackNavigator(routeConfigMap, stackConfig = {}) {
  const router = StackRouter(routeConfigMap, stackConfig);

  // Create a navigator with StackView as the view
  let Navigator = createNavigator(StackView, router, stackConfig);
  if (!stackConfig.disableKeyboardHandling) {
    Navigator = createKeyboardAwareNavigator(Navigator, stackConfig);
  }

  return Navigator;
}

<Link routeName="Profile" params={{ name: "brent" }}>
            About Brent
          </Link>
        </div>
        <div>
          <SceneView
            component={descriptor.getComponent()}
            navigation={descriptor.navigation}
          />
        </div>
      </div>
    );
  }
}

const AppNavigator = createNavigator(
  SidebarView,
  SwitchRouter({
    Home,
    About,
    Profile
  }),
  {}
);

const App = createBrowserApp(AppNavigator);

export default App;

component={descriptor.getComponent()}
        screenProps={this.props.screenProps || noScreenProps}
      />
    )
    return (
      <Kb.Box2 direction="horizontal" fullHeight={true} fullWidth={true}>
        <TabBar navigation={navigation} selectedTab={selectedTab as Tabs.AppTab} />
        {sceneView}
      </Kb.Box2>
    )
  }
}

const tabs = Shared.desktopTabs

const TabNavigator = createNavigator(
  TabView,
  SwitchRouter(
    tabs.reduce((map, tab) => {
      map[tab] = createNavigator(
        AppView,
        StackRouter(Shim.shim(routes), {
          initialRouteName: tabRoots[tab],
          initialRouteParams: undefined,
        }),
        {}
      )
      return map
    }, {}),
    {backBehavior: 'none', resetOnBlur: false}
  ),
  {}

return (
      <Kb.Box2 direction="horizontal" fullHeight={true} fullWidth={true}>
        <WalletsAndDetails>
          <SceneView
            navigation={childNav}
            component={descriptor.getComponent()}
            screenProps={this.props.screenProps || noScreenProps}
          />
        </WalletsAndDetails>
      </Kb.Box2>
    )
  }
}

const WalletsSubNavigator = createNavigator(
  WalletsSubNav,
  StackRouter(Shim.shim(walletsSubRoutes), {initialRouteName: 'wallet'}),
  {}
)
const OnboardingOrWalletsNavigator = createSwitchNavigator(
  {
    onboarding: RoutedOnboarding,
    walletsubnav: WalletsSubNavigator,
  },
  {initialRouteName: 'onboarding'}
)

type OnboardingOrWalletsProps = NavigationViewProps<any> & {acceptedDisclaimer: boolean}

class _OnboardingOrWallets extends React.Component<OnboardingOrWalletsProps> {
  static router = OnboardingOrWalletsNavigator.router

<Kb.Box2 direction="vertical" style={styles.modalContainer}>
            <SceneView
              key="ModalLayer"
              navigation={childNav}
              component={descriptor.getComponent()}
              screenProps={this.props.screenProps}
            />
          </Kb.Box2>
        )}
        <OutOfDate />
      </>
    )
  }
}

const LoggedInStackNavigator = createNavigator(
  ModalView,
  StackRouter(
    {
      Main: {screen: MainNavigator},
      ...Shim.shim(modalRoutes),
    },
    {}
  ),
  {}
)

const LoggedOutStackNavigator = createNavigator(
  AppView,
  StackRouter(
    {...Shim.shim(loggedOutRoutes)},
    {

<Text>
            {navigation.getParam('name')}
            's Profile
          </Text>
          <Button
            onPress={() => navigation.push('HomeScreen')}
            title="Go Home"
          />
          <Button onPress={() => navigation.goBack()} title="Go Back" />
        </View>
      </CardTransition>
    );
  }
}

const App = createNavigator(
  Transitioner,
  StackRouter({
    HomeScreen,
    ProfileScreen,
  }),
  {}
);

export default App;

tabs.reduce((map, tab) => {
      map[tab] = createNavigator(
        AppView,
        StackRouter(Shim.shim(routes), {
          initialRouteName: tabRoots[tab],
          initialRouteParams: undefined,
        }),
        {}
      )
      return map
    }, {}),
    {backBehavior: 'none', resetOnBlur: false}