alexvcasillas

import React from "react";
import styled from "styled-components";
import { Link } from "react-router-dom";

const TeamMember = styled(Link)`
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;

alexvcasillas

Arguments: 
  C:\Program Files\nodejs\node.exe C:\Program Files (x86)\Yarn\bin\yarn.js add gulp -D

PATH: 
  C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Users\Alex\.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm\;C:\Program Files (x86)\Skype\Phone\;C:\Program Files\Git\cmd;C:\ProgramData\chocolatey\bin;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\Microsoft SQL Server\Client SDK\ODBC\110\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files\Microsoft SQL Server\120\DTS\Binn\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files\Microsoft\Web Platform Installer\;C:\Program Files (x86)\Heroku\bin;C:\Program Files (x86)\git\cmd;C:\Program Files (x86)\Git\cmd;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Yarn\bin;C:\P

alexvcasillas

raven.js:51 Caught an exception! TypeError: Cannot read property 'slug' of undefined
    at Object.r.renderStory [as elementRenderer] (index.js:204)
    at renderElement (index.js:78)
    at t.value (List.js:124)
    at r (defaultCellRangeRenderer.js:107)
    at t.value (Grid.js:632)
    at t.value (Grid.js:475)
    at f._performComponentUpdate (ReactCompositeComponent.js:714)
    at f.updateComponent (ReactCompositeComponent.js:645)
    at f.receiveComponent (ReactCompositeComponent.js:547)

alexvcasillas

const githubStore = GithubStore.create({
  searchName: '',
  user: {},
  repos: [],
  fetchingData: false
});

alexvcasillas

Uncaught Error: [mobx-state-tree] Error while converting `{"searchName":"","user":{},"repos":[],"fetchingData":false}` to `GithubStore`:
at path "/user" snapshot `{}` is not assignable to type: `UserModel | null`, expected an instance of `UserModel | null` or a snapshot like `({ name: string; bio: (string | null?); avatar: string } | null?)` instead.

alexvcasillas

// This is the store
import fetch from 'node-fetch';
import { types } from 'mobx-state-tree';

const UserModel = types.model(
  'UserModel',
  {
    name: types.string,
    bio: types.maybe(types.string),
    avatar: types.string

alexvcasillas

utils.js:14 Uncaught (in promise) Error: [mobx-state-tree] Cannot modify 'GithubStore@<root>', the object is protected and can only be modified by using an action.
    at invariant (utils.js:14)
    at Object.fail (utils.js:6)
    at MSTAdministration.assertWritable (mst-node-administration.js:334)
    at ObjectType.willChange (object.js:76)
    at Array.<anonymous> (object.js:70)
    at interceptChange (mobx.js:1461)
    at setPropertyValue (mobx.js:2383)
    at GithubStore.set [as user] (mobx.js:2363)
    at github.js:34

alexvcasillas

/**
 * UPDATED ERROR WITH MOBX-STATE-TREE v0.6.1
 **/

// Store that throws this error.
import { runInAction } from 'mobx';
import { types } from 'mobx-state-tree';

const GithubStore = types.model(
  'GithubStore',

alexvcasillas

/**
 * mobx store migration to mobx-state-tree system
 **/


// Original MobX Store
import { observable, action, runInAction } from 'mobx';

export default class GithubStore {
  @observable searchName;

alexvcasillas

import fetch from 'node-fetch';
import { observable, action, runInAction } from 'mobx';

export default class GithubStore {
  @observable searchName;
  @observable user;
  @observable repos;
  @observable fetchingData;

  constructor() {