Skip to content

Instantly share code, notes, and snippets.

@alexvcasillas
Last active May 15, 2017 07:28
Show Gist options
  • Save alexvcasillas/6db0227c11e58ec3820fe878d5cbc1d9 to your computer and use it in GitHub Desktop.
Save alexvcasillas/6db0227c11e58ec3820fe878d5cbc1d9 to your computer and use it in GitHub Desktop.
Having an error while migrating mobx to mobx-state-tree and store.create({})
/**
* 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',
{
searchName: types.string,
user: types.frozen, // Object with all the user data that comes from the Github API Fetch
repos: types.array, // Array of Repositories that comes from the Github API Fetch
fetchingData: types.boolean
},
{
changeUserToSearchFor(username) {
this.searchName = username;
},
async fetchFromGithub(endpoint) {
const url = `https://api.github.com${endpoint}?client_id=my_client_id&client_secret=my_secret_id`;
const response = await fetch(url);
return await response.json();
},
async searchForUser() {
if (
!this.searchName ||
(this.user && this.searchName === this.user.login)
)
return;
this.fetchingData = true;
const [user, repos] = await Promise.all([
this.fetchFromGithub(`/users/${this.searchName}`),
this.fetchFromGithub(`/users/${this.searchName}/repos`)
]);
runInAction("Update State after fetching Github's Data", () => {
this.user = user;
this.repos = repos;
this.fetchingData = false;
});
}
}
);
export default GithubStore;
//Creating the Store with the following code also causes an error.
const githubStore = GithubStore.create({
searchName: '',
user: {},
repos: [],
fetchingData: false
});
bundle.js:50802 Uncaught Error: [mobx-state-tree] Error while converting `{"searchName":"","user":{},"repos":[],"fetchingData":false}` to `GithubStore`:
at path "/repos" snapshot `[]` is not assignable (View properties should not be provided in the snapshot).
at invariant (http://localhost:3001/static/js/bundle.js:50802:16)
at Object.fail (http://localhost:3001/static/js/bundle.js:50794:6)
at Object.typecheck (http://localhost:3001/static/js/bundle.js:51049:18)
at ObjectType.ComplexType.create (http://localhost:3001/static/js/bundle.js:50951:25)
at executeAction (http://localhost:3001/static/js/bundle.js:37392:20)
at ObjectType.res [as create] (http://localhost:3001/static/js/bundle.js:37383:17)
at Object.<anonymous> (http://localhost:3001/static/js/bundle.js:10875:37)
at __webpack_require__ (http://localhost:3001/static/js/bundle.js:556:30)
at fn (http://localhost:3001/static/js/bundle.js:87:20)
at Object.<anonymous> (http://localhost:3001/static/js/bundle.js:591:19)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment