story.tsx

import * as React from 'react'
import { NavigationContext, NavigationProp } from '@react-navigation/native'
import { ParamListBase } from '@react-navigation/routers'

/* Registry */

export type Route =
  | { name: 'feed' }
  | { name: 'meal'; id: string }
  | { name: 'login' }

function routeToScreen(route: Route): [string, object] {
  const name = route.name

  switch (name) {
    case 'feed': {
      return ['Feed', {}]
    }
    case 'meal': {
      return ['Meal', {}]
    }
    case 'login': {
      return ['Login', {}]
    }
    default: {
      const never: never = name
      throw new Error(`Unimplemented path ${name}`)
    }
  }
}

/* Behind the scenes */

type StoryNavigationProp = NavigationProp<ParamListBase> & {
  goto: (route: Route) => () => void
}

/**
 * Provides the story methods to function.
 */
export function useStory<T extends StoryNavigationProp>(): T {
  const navigation = React.useContext(NavigationContext) as StoryNavigationProp

  if (navigation === undefined) {
    throw new Error("Couldn't find a navigation object.")
  }

  /* append goto method */
  navigation.goto = (route: Route) => () =>
    navigation.navigate(...routeToScreen(route))

  return navigation as T
}