fix(overmind): properly deal with bundler replacing NODE_ENV

Author: christianalfoni

packages/node_modules/overmind-angular/src/directive.ts

@@ -11,13 +11,12 @@ import {
   Inject,
   // @ts-ignore
 } from '@angular/core'
-import { EventType, Overmind, MODE_SSR } from 'overmind'
+import { EventType, Overmind, MODE_SSR, ENVIRONMENT } from 'overmind'
 import { IS_PROXY } from 'proxy-state-tree'
 
 export const OVERMIND_INSTANCE = new InjectionToken('OVERMIND')
 
-// @ts-ignore
-const IS_PRODUCTION = process.env.NODE_ENV === 'production'
+const IS_PRODUCTION = ENVIRONMENT === 'production'
 
 let nextComponentId = 0
 

packages/node_modules/overmind-react/src/index.ts

@@ -2,18 +2,23 @@ import 'proxy-state-tree'
 
 import {
   Config as DefaultConfig,
+  ENVIRONMENT,
   EventType,
   IConfiguration,
   MODE_SSR,
   Overmind,
-  OvermindMock
+  OvermindMock,
 } from 'overmind'
 import { IMutationCallback } from 'proxy-state-tree'
 import * as react from 'react'
-import { unstable_cancelCallback, unstable_getCurrentPriorityLevel, unstable_scheduleCallback } from 'scheduler'
+import {
+  unstable_cancelCallback,
+  unstable_getCurrentPriorityLevel,
+  unstable_scheduleCallback,
+} from 'scheduler'
 
-const IS_PRODUCTION = process.env.NODE_ENV === 'production'
-const IS_TEST = process.env.NODE_ENV === 'test'
+const IS_PRODUCTION = ENVIRONMENT === 'production'
+const IS_TEST = ENVIRONMENT === 'test'
 const isNode =
   !IS_TEST && process && process.title && process.title.includes('node')
 
@@ -40,12 +45,8 @@ function getFiberType(component) {
 
 // Inspired from https://github.com/facebook/react/blob/master/packages/react-devtools-shared/src/backend/renderer.js
 function getDisplayName(component): string {
-  const type = getFiberType(component);
-  return (
-    type.displayName ||
-    type.name ||
-    'Anonymous'
-  );
+  const type = getFiberType(component)
+  return type.displayName || type.name || 'Anonymous'
 }
 
 export interface IConnect<Config extends IConfiguration = DefaultConfig> {
@@ -75,19 +76,19 @@ export const Provider: react.ProviderExoticComponent<
 > = context.Provider
 
 function useForceRerender() {
-  const [{ flushId }, setTick] = react.useState({ tick: 0, flushId: 0})
+  const [{ flushId }, setTick] = react.useState({ tick: 0, flushId: 0 })
 
   const forceRerender = react.useCallback((flushId?) => {
-      setTick(current => ({
-        ...current,
-        tick: current.tick + 1,
-        flushId: flushId || current.flushId
-      }))
+    setTick((current) => ({
+      ...current,
+      tick: current.tick + 1,
+      flushId: flushId || current.flushId,
+    }))
   }, [])
 
   return {
     flushId,
-    forceRerender
+    forceRerender,
   }
 }
 
@@ -103,7 +104,9 @@ const useCurrentComponent = () => {
     : {}
 }
 
-const useState =  <Config extends IConfiguration>(): Overmind<Config>['state'] => {
+const useState = <Config extends IConfiguration>(): Overmind<
+  Config
+>['state'] => {
   const overmind = react.useContext(context) as Overmind<Config>
 
   if (!(overmind as any).mode) {
@@ -116,22 +119,24 @@ const useState =  <Config extends IConfiguration>(): Overmind<Config>['state'] =
 
   const trackingRef = react.useRef<any>(null)
 
-  const {flushId, forceRerender} = useForceRerender()
+  const { flushId, forceRerender } = useForceRerender()
 
   if (!trackingRef.current) {
     trackingRef.current = {
       tree: (overmind as any).proxyStateTree.getTrackStateTree(),
       hasUpdatedBeforeCommit: false,
-      stopTrackingTask: unstable_scheduleCallback(unstable_getCurrentPriorityLevel(), () => {
-        trackingRef.current.tree.stopTracking()
-      })
+      stopTrackingTask: unstable_scheduleCallback(
+        unstable_getCurrentPriorityLevel(),
+        () => {
+          trackingRef.current.tree.stopTracking()
+        }
+      ),
     }
   }
 
   if (IS_PRODUCTION) {
     react.useLayoutEffect(() => {
       trackingRef.current.mounted = true
-      
 
       if (trackingRef.current.hasUpdatedBeforeCommit) {
         forceRerender()
@@ -217,7 +222,9 @@ const useState =  <Config extends IConfiguration>(): Overmind<Config>['state'] =
   return trackingRef.current.tree.state
 }
 
-const useActions =  <Config extends IConfiguration>(): Overmind<Config>['actions'] => {
+const useActions = <Config extends IConfiguration>(): Overmind<
+  Config
+>['actions'] => {
   const overmind = react.useContext(context) as Overmind<Config>
 
   if (!(overmind as any).mode) {
@@ -227,7 +234,9 @@ const useActions =  <Config extends IConfiguration>(): Overmind<Config>['actions
   return overmind.actions
 }
 
-const useEffects =  <Config extends IConfiguration>(): Overmind<Config>['effects'] => {
+const useEffects = <Config extends IConfiguration>(): Overmind<
+  Config
+>['effects'] => {
   const overmind = react.useContext(context) as Overmind<Config>
 
   if (!(overmind as any).mode) {
@@ -237,7 +246,9 @@ const useEffects =  <Config extends IConfiguration>(): Overmind<Config>['effects
   return overmind.effects
 }
 
-const useReaction =  <Config extends IConfiguration>(): Overmind<Config>['reaction'] => {
+const useReaction = <Config extends IConfiguration>(): Overmind<
+  Config
+>['reaction'] => {
   const overmind = react.useContext(context) as Overmind<Config>
 
   if (!(overmind as any).mode) {
@@ -247,23 +258,33 @@ const useReaction =  <Config extends IConfiguration>(): Overmind<Config>['reacti
   return overmind.reaction
 }
 
-export const createStateHook: <Config extends IConfiguration = DefaultConfig>() => () => Overmind<Config>['state'] = () => {
+export const createStateHook: <
+  Config extends IConfiguration = DefaultConfig
+>() => () => Overmind<Config>['state'] = () => {
   return useState as any
 }
 
-export const createActionsHook: <Config extends IConfiguration = DefaultConfig>() => () => Overmind<Config>['actions'] = ()=> {
+export const createActionsHook: <
+  Config extends IConfiguration = DefaultConfig
+>() => () => Overmind<Config>['actions'] = () => {
   return useActions as any
 }
 
-export const createEffectsHook: <Config extends IConfiguration = DefaultConfig>() => () => Overmind<Config>['effects'] = () => {
+export const createEffectsHook: <
+  Config extends IConfiguration = DefaultConfig
+>() => () => Overmind<Config>['effects'] = () => {
   return useEffects as any
 }
 
-export const createReactionHook: <Config extends IConfiguration = DefaultConfig>() => () => Overmind<Config>['reaction'] = () => {
+export const createReactionHook: <
+  Config extends IConfiguration = DefaultConfig
+>() => () => Overmind<Config>['reaction'] = () => {
   return useReaction as any
 }
 
-export const createHook: <Config extends IConfiguration = DefaultConfig>() => () => {
+export const createHook: <
+  Config extends IConfiguration = DefaultConfig
+>() => () => {
   state: Overmind<Config>['state']
   actions: Overmind<Config>['actions']
   effects: Overmind<Config>['effects']
@@ -281,7 +302,7 @@ export const createHook: <Config extends IConfiguration = DefaultConfig>() => ()
       actions,
       effects,
       reaction: overmind.reaction,
-      addMutationListener: overmind.addMutationListener
+      addMutationListener: overmind.addMutationListener,
     } as any
   }
 }
@@ -307,11 +328,9 @@ export const createConnect: <
     keyof IConnect<Overmind<ThisConfig>>
   >
 > = <Props, TComponent extends IReactComponent>() => {
-  return (
-    component
-  ) => {
+  return (component) => {
     let componentInstanceId = 0
-    const name = component.displayName || component.name || 'Anonymous';
+    const name = component.displayName || component.name || 'Anonymous'
     const populatedComponent = component as any
     populatedComponent.__componentId =
       typeof populatedComponent.__componentId === 'undefined'
@@ -335,7 +354,7 @@ export const createConnect: <
     }
 
     if (IS_PRODUCTION) {
-      class HOC extends react.Component<{innerRef: react.Ref<TComponent>}> {
+      class HOC extends react.Component<{ innerRef: react.Ref<TComponent> }> {
         tree: any
         overmind: any
         state: {
@@ -401,14 +420,16 @@ export const createConnect: <
         }
       }
 
-      const refForwarder = react.forwardRef<TComponent, Props>((props, ref) => react.createElement(HOC, {
-        ...props,
-        innerRef: ref
-      }))
+      const refForwarder = react.forwardRef<TComponent, Props>((props, ref) =>
+        react.createElement(HOC, {
+          ...props,
+          innerRef: ref,
+        })
+      )
 
       return refForwarder
     } else {
-      class HOC extends react.Component<{innerRef: react.Ref<TComponent>}> {
+      class HOC extends react.Component<{ innerRef: react.Ref<TComponent> }> {
         tree: any
         overmind: any
         componentInstanceId = componentInstanceId++
@@ -504,10 +525,12 @@ export const createConnect: <
         }
       }
 
-      const refForwarder = react.forwardRef<TComponent, Props>((props, ref) => react.createElement(HOC, {
-        ...props,
-        innerRef: ref
-      }))
+      const refForwarder = react.forwardRef<TComponent, Props>((props, ref) =>
+        react.createElement(HOC, {
+          ...props,
+          innerRef: ref,
+        })
+      )
 
       Object.defineProperties(refForwarder, {
         name: {