How to use overmind - 10 common examples

editor_user_id: string;
}>> = mutate(({ state }, { _isOwnMessage, data }) => {
  if (!_isOwnMessage) {
    const userId = data.editor_user_id;

    const editors = state.live.roomInfo.editorIds;
    const newEditors = editors.filter(id => id !== userId);

    state.live.roomInfo.editorIds = newEditors;
  }
});

export const onOperation: Operator> = mutate(({ state, effects }, { _isOwnMessage, data }) => {
  if (state.live.isLoading) {
    return;
  }
  if (_isOwnMessage) {
    effects.live.serverAck(data.module_shortid);
  } else {
    try {
      effects.live.applyServer(data.module_shortid, data.operation);
    } catch (e) {
      // Something went wrong, probably a sync mismatch. Request new version
      console.error('Something went wrong with applying OT operation');
      effects.live.sendModuleStateSyncRequest();
    }
  }
});

export const initialize = (component, callback1) => {
  /*
    Configure Cerebral and Overmind
  */
  const overmind = createOvermind(config, {
    // devtools:
    // (window.opener && window.opener !== window) || !window.chrome
    //   ? false
    //   : 'localhost:3031',
    devtools: false,
    name:
      'PIB material editor - ' +
      (navigator.userAgent.indexOf('Chrome/76') > 0 ? 'Chrome' : 'Canary'),
    logProxies: true
  })

  getState = path =>
    path
      ? path.split('.').reduce((aggr, key) => aggr[key], overmind.state)
      : overmind.state
  getSignal = path =>

effects.notificationToast.success(
    state.live.isTeam ? 'Connected to Live Team!' : 'Connected to Live!'
  );

  if (state.live.reconnecting) {
    effects.live.getAllClients().forEach(client => {
      client.serverReconnect();
    });
  }

  state.live.reconnecting = false;
});

export const onModuleState: Operator> = mutate(({ state, actions }, { data }) => {
  actions.live.internal.initializeModuleState(data.module_state);
});

export const onUserEntered: Operator> = mutate(({ state, effects }, { data }) => {
  if (state.live.isLoading) {
    return;
  }

  const users = camelizeKeys(data.users);

  // TODO: What happening here? Is it not an array of users?

state.editor.currentSandbox.modules.splice(moduleIndex, 1);
  effects.vscode.sandboxFsSync.unlink(
    state.editor.modulesByPath,
    removedModule
  );

  if (wasCurrentModule) {
    actions.editor.internal.setCurrentModule(state.editor.mainModule);
  }

  actions.editor.internal.updatePreviewCode();
});

export const onDirectoryCreated: Operator> = mutate(({ state, effects }, { _isOwnMessage, data }) => {
  if (_isOwnMessage) {
    return;
  }
  // Should this not be a directory?
  state.editor.currentSandbox.directories.push(data.module);
  effects.vscode.sandboxFsSync.mkdir(state.editor.modulesByPath, data.module);
});

export const onDirectoryUpdated: Operator> = mutate(({ state, actions, effects }, { _isOwnMessage, data }) => {
  if (_isOwnMessage) {
    return;
  }
  const sandbox = state.editor.currentSandbox;

state.live.reconnecting = false;
});

export const onModuleState: Operator> = mutate(({ state, actions }, { data }) => {
  actions.live.internal.initializeModuleState(data.module_state);
});

export const onUserEntered: Operator> = mutate(({ state, effects }, { data }) => {
  if (state.live.isLoading) {
    return;
  }

  const users = camelizeKeys(data.users);

  // TODO: What happening here? Is it not an array of users?
  // Check the running code and fix the type
  state.live.roomInfo.users = users as any;
  state.live.roomInfo.editorIds = data.editor_ids;
  state.live.roomInfo.ownerIds = data.owner_ids;

  if (data.joined_user_id === state.live.liveUserId) {
    return;
  }

const debug = _debug('cs:app');

window.setImmediate = (func, delay) => setTimeout(func, delay);

window.addEventListener('unhandledrejection', e => {
  if (e && e.reason && e.reason.name === 'Canceled') {
    // This is an error from vscode that vscode uses to cancel some actions
    // We don't want to show this to the user
    e.preventDefault();
  }
});

window.__isTouch = !matchMedia('(pointer:fine)').matches;

const overmind = createOvermind(config, {
  devtools:
    (window.opener && window.opener !== window) || !window.chrome
      ? false
      : 'localhost:3031',
  name:
    'CodeSandbox - ' +
    (navigator.userAgent.indexOf('Chrome/76') > 0 ? 'Chrome' : 'Canary'),
  logProxies: true,
});

if (process.env.NODE_ENV === 'production') {
  const ignoredOvermindActions = [
    'onInitialize',
    'server.onCodeSandboxAPIMessage',
    'track',
    'editor.previewActionReceived',

constructor(props) {
    super(props)

    const mutations = props.pageProps.mutations || []

    if (typeof window !== 'undefined') {
      // On the client we just instantiate the Overmind instance and run
      // the "changePage" action
      this.overmind = createOvermind(config)
      this.overmind.actions.changePage(mutations)
    } else {
      // On the server we rehydrate the mutations to an SSR instance of Overmind,
      // as we do not want to run any additional logic here
      this.overmind = createOvermindSSR(config)
      rehydrate(this.overmind.state, mutations)
    }
  }
  // CLIENT: After initial route, on page change

import React from "react"
import { render } from "react-dom"
import App from "./components/App"
import { config } from "./overmind"
import { createOvermind } from "overmind"
import { Provider } from "overmind-react"

const overmind = createOvermind(config)

// Since we are using HtmlWebpackPlugin WITHOUT a template, we should create our own root node in the body element before rendering into it
const root = document.createElement("div")

root.id = "root"
document.body.appendChild(root)

render(
  
    
  ,
  document.getElementById("root")
)

import { injectGlobal } from 'emotion'
import { createOvermind } from 'overmind'
import { Provider } from 'overmind-react'
import { createElement } from 'react'
import { render } from 'react-dom'
import { setConfig } from 'react-hot-loader'

import App from './components/App'
import * as iconFont from './icomoon.woff2'
import { config } from './overmind'

const overmind = createOvermind(
  config,
  process.env.NODE_ENV === 'production'
    ? {
        devtools: false,
      }
    : {
        devtools: true,
      }
)

setConfig({
  ignoreSFC: true, // RHL will be __completely__ disabled for SFC
  pureRender: true, // RHL will not change render method
})

injectGlobal`

beforeDestroy(this: any) {
      if (overmind.mode.mode === MODE_SSR) return

      // @ts-ignore
      overmind.proxyStateTree.disposeTree(this[OVERMIND].tree)
      if (IS_PRODUCTION) {
        return
      }

      overmind.eventHub.emitAsync(EventType.COMPONENT_REMOVE, {
        componentId,
        componentInstanceId: this[OVERMIND].componentInstanceId,
        name: this.$options.name || '',
      })
    },
  }