Merge pull request #56 from underscopeio/feat/extract-helper-methods

Extract helper methods from useNavigation hook

src/helpers/createNavigationCommands.ts

@@ -1,11 +1,9 @@
-import { Layout, LayoutRoot, Navigation, Options } from 'react-native-navigation'
+import { Layout, Navigation, Options } from 'react-native-navigation'
 import createLayout from './createLayout'
 
-interface SetRootCommand {
-  (layoutRoot: LayoutRoot): Promise<any>
-  (layout: Layout): Promise<any>
-  <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
-}
+import setRoot, { SetRootCommand } from './setRoot'
+import showModal, { ShowModalCommand } from './showModal'
+import showOverlay, { ShowOverlayCommand } from './showOverlay'
 
 interface SetStackRootCommand {
   <P = {}>(layout: Layout<P> | Layout<P>[]): Promise<any>
@@ -19,31 +17,45 @@ interface PushCommand {
   <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
 }
 
-interface ShowModalCommand {
-  (layout: Layout): Promise<any>
-  <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
-}
-
-interface ShowOverlayCommand {
-  (layout: Layout): Promise<any>
-  <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
-}
-
 export type NavigationCommands = {
-  setRoot: SetRootCommand
   setStackRoot: SetStackRootCommand
   push: PushCommand
-  showModal: ShowModalCommand
-  showOverlay: ShowOverlayCommand
   mergeOptions: (options: Options) => void
   updateProps: (props: object) => void
   dismissModal: (mergeOptions?: Options) => Promise<any>
   pop: (mergeOptions?: Options) => Promise<any>
   popTo: (mergeOptions?: Options) => Promise<any>
   popToRoot: (mergeOptions?: Options) => Promise<any>
   dismissOverlay: () => Promise<any>
+
+  /**
+   * @deprecated Use setRoot import from 'react-native-navigation-hooks'
+   */
+  setRoot: SetRootCommand
+
+  /**
+   * @deprecated Use setRoot import from 'react-native-navigation-hooks'
+   */
+  showModal: ShowModalCommand
+
+  /**
+   * @deprecated Use showOverlay import from 'react-native-navigation-hooks'
+   */
+  showOverlay: ShowOverlayCommand
+
+  /**
+   * @deprecated Use Navigation.setDefaultOptions instead
+   */
   setDefaultOptions: (options: Options) => void
+
+  /**
+   * @deprecated Use Navigation.dismissAllModals instead
+   */
   dismissAllModals: (mergeOptions?: Options) => Promise<any>
+
+  /**
+   * @deprecated Use Navigation.getLaunchArgs instead
+   */
   getLaunchArgs: () => Promise<any>
 }
 
@@ -62,20 +74,6 @@ function createNavigationCommands(
    */
   componentId: string
 ): NavigationCommands {
-  function setRoot<P = {}>(nameOrLayout: string | Layout | LayoutRoot, passProps?: P, options?: Options) {
-    let layoutRoot
-
-    if (typeof nameOrLayout === 'string') {
-      layoutRoot = { root: createLayout<P>(nameOrLayout, passProps, options) } as LayoutRoot
-    } else if ((nameOrLayout as LayoutRoot).root) {
-      layoutRoot = nameOrLayout as LayoutRoot
-    } else {
-      layoutRoot = { root: nameOrLayout } as LayoutRoot
-    }
-
-    return Navigation.setRoot(layoutRoot)
-  }
-
   function setStackRoot<P = {}>(nameOrLayout: string | Layout<P> | Array<Layout<P>>, passProps?: P, options?: Options) {
     const layout = typeof nameOrLayout === 'string' ? createLayout<P>(nameOrLayout, passProps, options) : nameOrLayout
 
@@ -88,18 +86,6 @@ function createNavigationCommands(
     return Navigation.push(componentId, layout)
   }
 
-  function showModal<P = {}>(nameOrLayout: string | Layout<P>, passProps?: P, options?: Options) {
-    const layout = typeof nameOrLayout === 'string' ? createLayout<P>(nameOrLayout, passProps, options) : nameOrLayout
-
-    return Navigation.showModal(layout)
-  }
-
-  function showOverlay<P = {}>(nameOrLayout: string | Layout<P>, passProps?: P, options?: Options) {
-    const layout = typeof nameOrLayout === 'string' ? createLayout<P>(nameOrLayout, passProps, options) : nameOrLayout
-
-    return Navigation.showOverlay(layout)
-  }
-
   function mergeOptions(options: Options) {
     return Navigation.mergeOptions(componentId, options)
   }
@@ -135,18 +121,18 @@ function createNavigationCommands(
   const { setDefaultOptions, dismissAllModals, getLaunchArgs } = Navigation
 
   return {
-    setRoot,
     setStackRoot,
     push,
-    showModal,
-    showOverlay,
     mergeOptions,
     updateProps,
     dismissModal,
     pop,
     popTo,
     popToRoot,
     dismissOverlay,
+    setRoot,
+    showModal,
+    showOverlay,
     setDefaultOptions,
     dismissAllModals,
     getLaunchArgs,

src/helpers/index.ts

@@ -1,3 +1,6 @@
 export { default as createLayout } from './createLayout'
 export { default as createStack } from './createStack'
 export { default as createNavigationCommands } from './createNavigationCommands'
+export { default as setRoot } from './setRoot'
+export { default as showModal } from './showModal'
+export { default as showOverlay } from './showOverlay'

src/helpers/setRoot.ts

@@ -0,0 +1,24 @@
+import { Layout, LayoutRoot, Navigation, Options } from 'react-native-navigation'
+import createLayout from './createLayout'
+
+export interface SetRootCommand {
+  (layoutRoot: LayoutRoot): Promise<any>
+  (layout: Layout): Promise<any>
+  <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
+}
+
+function setRoot<P = {}>(nameOrLayout: string | Layout | LayoutRoot, passProps?: P, options?: Options) {
+  let layoutRoot
+
+  if (typeof nameOrLayout === 'string') {
+    layoutRoot = { root: createLayout<P>(nameOrLayout, passProps, options) } as LayoutRoot
+  } else if ((nameOrLayout as LayoutRoot).root) {
+    layoutRoot = nameOrLayout as LayoutRoot
+  } else {
+    layoutRoot = { root: nameOrLayout } as LayoutRoot
+  }
+
+  return Navigation.setRoot(layoutRoot)
+}
+
+export default setRoot

src/helpers/showModal.ts

@@ -0,0 +1,15 @@
+import { Layout, Navigation, Options } from 'react-native-navigation'
+import createLayout from './createLayout'
+
+export interface ShowModalCommand {
+  (layout: Layout): Promise<any>
+  <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
+}
+
+function showModal<P = {}>(nameOrLayout: string | Layout<P>, passProps?: P, options?: Options) {
+  const layout = typeof nameOrLayout === 'string' ? createLayout<P>(nameOrLayout, passProps, options) : nameOrLayout
+
+  return Navigation.showModal(layout)
+}
+
+export default showModal

src/helpers/showOverlay.ts

@@ -0,0 +1,15 @@
+import { Layout, Navigation, Options } from 'react-native-navigation'
+import createLayout from './createLayout'
+
+export interface ShowOverlayCommand {
+  (layout: Layout): Promise<any>
+  <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
+}
+
+function showOverlay<P = {}>(nameOrLayout: string | Layout<P>, passProps?: P, options?: Options) {
+  const layout = typeof nameOrLayout === 'string' ? createLayout<P>(nameOrLayout, passProps, options) : nameOrLayout
+
+  return Navigation.showOverlay(layout)
+}
+
+export default showOverlay

website/docs/helpers.mdx

@@ -4,55 +4,67 @@ title: Helpers
 sidebar_label: Helpers
 ---
 
-### `createNavigationCommands`
+### `setRoot`
 
-A set of overloaded methods which reduce the boilerplate required to execute common navigation commands.
+Overloaded method which reduces the boilerplate required for the `setRoot` command.
 
 ```ts
 interface SetRootCommand {
   (layoutRoot: LayoutRoot): Promise<any>
   (layout: Layout): Promise<any>
   <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
 }
+```
 
-interface SetStackRootCommand {
+### `showModal`
+
+Overloaded method which reduces the boilerplate required for the `showModal` command.
+
+```ts
+interface ShowModalCommand {
   (layout: Layout): Promise<any>
   <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
 }
+```
 
-interface PushCommand {
-  <P = {}>(layout: Layout<P>): Promise<any>
-  (name: string): Promise<any>
-  <P = {}>(name: string, passProps?: P): Promise<any>
+### `showOverlay`
+
+Overloaded method which reduces the boilerplate required for the `showOverlay` command.
+
+```ts
+interface ShowOverlayCommand {
+  (layout: Layout): Promise<any>
   <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
 }
+```
 
-interface ShowModalCommand {
+### `createNavigationCommands`
+
+A set of overloaded methods which reduce the boilerplate required to execute common navigation commands.
+
+```ts
+interface SetStackRootCommand {
   (layout: Layout): Promise<any>
   <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
 }
 
-interface ShowOverlayCommand {
-  (layout: Layout): Promise<any>
+interface PushCommand {
+  <P = {}>(layout: Layout<P>): Promise<any>
+  (name: string): Promise<any>
+  <P = {}>(name: string, passProps?: P): Promise<any>
   <P = {}>(name: string, passProps?: P, options?: Options): Promise<any>
 }
 
 export type NavigationCommands = {
-  setRoot: SetRootCommand
   setStackRoot: SetStackRootCommand
   push: PushCommand
-  showModal: ShowModalCommand
-  showOverlay: ShowOverlayCommand
   mergeOptions: (options: Options) => void
   updateProps: (props: object) => void
   dismissModal: (mergeOptions?: Options) => Promise<any>
   pop: (mergeOptions?: Options) => Promise<any>
   popTo: (mergeOptions?: Options) => Promise<any>
   popToRoot: (mergeOptions?: Options) => Promise<any>
   dismissOverlay: () => Promise<any>
-  setDefaultOptions: (options: Options) => void
-  dismissAllModals: (mergeOptions?: Options) => Promise<any>
-  getLaunchArgs: () => Promise<any>
 }
 ```