Questions tagged [mobx-state-tree]
mobx-state-tree is a state container for javascript apps that is powered by Mobx
207
questions
0
votes
0
answers
18
views
What is the difference between React's MobX-state-tree's types?
I'm learning React and using the MobX-state-tree (MST) state manager.
I'm also using TypeScript and want to add types to my MST models without rewriting the properties and actions, but I don't ...
0
votes
0
answers
16
views
How to describe model of mobx-state-tree with interface of typescript with optional fields?
I have monorepo consists of 3 packages FE (ReactJS), BE (NestJS) and shared-types (types/interfaces shared between FE and BE).
In share-types I have User interface
interface User {
firstName?: ...
1
vote
1
answer
120
views
is it possible to call a MobxStateTree action from a child model?
I create a Mobx State Tree global state composed by a DataModel that contains a TranslationsDataModel. In DataModel I created a fetchDataset function that I would like to call in TranslationsDataModel ...
0
votes
0
answers
19
views
MobX : How to observe only selected part of the entire store?
The variable Models will store an array of model objects.
SelectedIndex will get changed by the UI through the action setSelectedIndex.
The Action addToResult should add the incoming data to the ...
0
votes
0
answers
45
views
Mobx state tree types.function is undefined
Is there a way to create Mobx store with navigate property? Something like this:
const navigate = useNavigate();
const location = useLocation();
const mobxStore = useMemo(() => RootStore....
0
votes
0
answers
17
views
Use csv data in mobx state tree model
I'm very new to mobx state tree. I'm trying to use csv data from a local csv (stored in public/data/data.csv).
Here's what I have in my store (file called Data.js):
import { types, flow } from "...
-1
votes
1
answer
347
views
Mobx State Tree not re-rendering component
I'm trying to make MST work with a simple model and a single component within my route.
The update function is called correctly but the component is not rendered again.
import { observer } from 'mobx-...
0
votes
2
answers
169
views
Jest & Mobx: how to test execution of disposer?
Hope anyone already overcome this issue.
codesandbox
I want to check, that after changing appliedIds, loadCampaign will be executed. As we say in disposer:
addDisposer( self, reaction(() => self....
0
votes
1
answer
350
views
How to define a model with mobx-state-tree with unknown properties
I have to create a model using MobX-State-Tree that represents the response of an API. The response is like this TypeScript type:
type Tree = {
question: string,
field: string,
options: Record&...
0
votes
0
answers
126
views
Mobx State Tree, passing Derived proprty to React Native Flat List
I'm using MST with Reactive Native and a FlatList and displaying the list all OK.
However, one property of my state tree model is a derived view, and as far as I can see, this is not passed into the ...
0
votes
0
answers
18
views
Is there a way to simplify very long typescript errors when dealing with large, complex types?
I'm working on a typescript project, and I have a quite complicated and nested type system. I'm also working with mobx-state-tree, which makes the types even more complicated, and the errors are ...
0
votes
1
answer
63
views
How to get data from server with mobx using functional component
I need to make a simple GET request with mobx using functional components using fetch to server with this API https://jservice.io/api/category?id=150 Get data and then display it in my user interface ...
0
votes
0
answers
247
views
Mobx store do not update with observer
I have a simple react native app with two screens.
First screen is the list, where you see your selected groups, and you can remove them, by clicking on trash icon:
export const Settings: NavioScreen =...
0
votes
0
answers
232
views
TS2532: Object is possibly 'undefined' while being assigned on the previous line
I've been looking at the questions and answers regarding this TypeScript error but none of them are the same as the problem as the one I will describe here as far as I know.
The exact error I get is: ...
0
votes
0
answers
193
views
Mobx observer doesn't trigger a re-render in React
I am new to mobx and trying to create a simple project that displays a list of NBA players' info using mobx-state-tree.
The fetchPlayers() method in useEffect successfully gets the information and ...
1
vote
1
answer
964
views
How to use a typescript type as a property type inside Mobx State tree model
I am using a Qraphql code generator that generates the schema types in typescript and would like to use those types inside the model.
My question is how can I use a typescript type inside the Mobx ...
1
vote
1
answer
311
views
Where is the better places for React.createContext and React.useContext? (+ mobx-state-tree useLocalObservable as provider)
I'm working on a react app with mobx-state-tree.
I want to get some advices for 2 things.
Q1 - Where is the better place for React.useContext?
Q2 - Which is better to use the stored things? inherit? ...
1
vote
1
answer
343
views
Mobx. parent component is not re-rendered?
I'm learning mobx. I can not understand why the parent component is not re-rendered. When the button is clicked, the value of the field in the observed object changes. The parent component is an ...
2
votes
1
answer
385
views
Cannot copy mst model data from one model to other
I'm trying to make a news app which can take response from news api and store it in newsFeed and then user can mark some news as favourites and then store these fav to new model favourite
this is the ...
1
vote
0
answers
490
views
Can't persist MobX state tree in React Native
I am using MobX-state-tree for state management and mst-persist to persist my data. The problem is when I reload the app the initial data of the store renders first and then the persist data gets ...
0
votes
1
answer
257
views
How to modify currentUserStore in mobx-state-tree
I'm trying to wrap my head around mobx-state-tree and whipped up a simple currentUserStore to hold some data for a logged in user and allow login/logout:
import { types } from "mobx-state-tree&...
2
votes
1
answer
206
views
typescript get "typeof" Generic class inside type declaration
I'm trying to make a custom hook that gets 2 parameters:
1- a class that's actually is a mobx store
2- parameters of that class constructor
this hook is lookalike this in javascript:
/**
* @template ...
3
votes
1
answer
378
views
Mobs-state-tree action fails due to protection
In the following store I try to upload some photos and want to update the UI with the progress. This is my main store:
const Store = types
.model({
photos: types.array(Photo),
isLoading: ...
2
votes
1
answer
2k
views
Cannot add an object to a state tree if it is already part of the same or another state tree
mobx-state-tree.module.js?f7d3:2154 Uncaught Error: [mobx-state-tree] Cannot add an object to a state tree if it is already part of the same or another state tree.
I get this error just by filtering ...
1
vote
1
answer
715
views
Reordering Array for Todos in MST Mobx State Tree
I would like to reorder arrays when using mobx state tree.
Say I have this example taken from the example page.
How do I get to reorder my ToDos in the TodoStore.
As a simplified example, say my todos ...
4
votes
1
answer
567
views
How to convert datetime string to date object via mobx-state-tree properly
there is incoming string data which is date time format,
Its mapping this object fine;
import { types } from 'mobx-state-tree'
export const UserCard = types.model('UserCard').props({
id: types....
5
votes
2
answers
617
views
Rerender AppNavigator on state change
I am trying to render certain nav stacks depending on a isAuthenticated state. The problem that I am having is that AppNavigator is only rendered on the first render and not with any other changes ...
0
votes
1
answer
413
views
how to cast json to typescript object
There initialized JSON data, I need to convert this as an type(mobx-state-tree) of object defined as belows,
const resultData = [
{
survey_id: 9,
title: 'Test Survey id9',
is_anonymous: ...
0
votes
1
answer
1k
views
How to persist Mobx-state-tree data on NextJS
I'm trying to use Mobx-state-tree with NextJS like in this example.
Problem
After user login user details are saved in mobx state. but after page refresh those data are gone. I want to persist data on ...
1
vote
1
answer
564
views
How use Mobx 6 storage with React 17?
I'm completely confused with the rules of mobX - react . Some methods in another project work, but not in this test.
Below is the code of my components from the test application
App.js
import React, { ...
0
votes
1
answer
535
views
Mobx State Manager - calling an action from another action causing error
I'm implementing a React Todo List with Mobx-State-Tree as a state manager.
from the fetchTodos function I'm calling the setTodos function.
It seems like the code is working,
but I don't understand ...
1
vote
1
answer
3k
views
Error: [mobx-state-tree] expected mobx-state-tree type as argument 1, got undefined instead
ERROR Error: [mobx-state-tree] expected mobx-state-tree type as argument 1, got undefined instead
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling ...
0
votes
1
answer
313
views
generator function doesn't resume after yield
So I'm trying to debug why my array of questions is not being properly populated in my mobx-state-tree questions-store. Nothing after the yield statement in the getQuestions action runs.
// question-...
1
vote
1
answer
499
views
React Native change state leads to mobx-state-tree exception
I have a problem with changing the value in my state. I have
state = {
......,
tags: []
}
and these tags are filled like:
tags: this.props.userStore.details.tags
tags are a list of ...
0
votes
1
answer
395
views
Why we can use any prop name in function react without explicit mention?
I'm learning mobX-state-tree, and in their tutorial code, i see this
const App = observer(props => (
<div>
<button onClick={e => props.store.addTodo(randomId(), "New Task&...
6
votes
1
answer
1k
views
Typescript does not infer promise type when using yield in a generator function
I'm using Axios to handle some API fetching, and I'm executing that call within a generator; async/await is not an option for this particular project. For some reason, even though axios is getting my ...
0
votes
1
answer
671
views
React Mobx with MST: Refresh token implement logic
I come from Redux and I start to learn MST.
I try to introduce the logic of Token's refreshing professionally. I have already explained what it is supposed to:
Client sends a request to the server
...
0
votes
1
answer
1k
views
Trying to connect to MongoDB using Realm
It's the first time I use Realm and MongoDB.
I followed this good tutorial as starting point and I create this project.
https://codesandbox.io/s/realm-forked-mrjex?file=/src/state/DbModel.ts
The ...
1
vote
1
answer
792
views
Mobx with TypeScript incompatible types error
I am trying to set the vehicles array to the array that I am getting from the store. However, it seems that Typescript is complaining about something.
My model looks like this:
import { types } from '...
0
votes
1
answer
253
views
Stub MST getter involving getRoot prior to afterCreate executing using Sinon in a Karma test environment
I have a store of the form:
import { addDisposer, types, getRoot } from 'mobx-state-tree';
import { reaction } from 'mobx';
const MainMenuViewStore = types
.model('MainMenuViewStore')
.views((...
1
vote
1
answer
216
views
Getting 'undefined is not an object' error when trying to use MST in react native Ignite template
I am using Ignite template for react native. I have created a simple object model and store that looks like so:
export const TimeObject = types.model('TimeObject', {
id: types.identifier,
hour: ...
1
vote
1
answer
554
views
Error using mobx-state-tree + yup with typescript (SchemaOf with SnapshotOut not working!!)
I'm trying to use Yup + Mobx-state-tree with Typescript... but for simple cases i'm getting erros...
const UserNameModel = types.model({
name: types.string,
});
type UserNameModelSnapshot = ...
0
votes
2
answers
889
views
How to write getParent correctly with typescript
So I have two models: RootStore and ProjectsModel:
const RootStore = types
.model({
user: types.maybeNull(User),
projects: ProjectsModel,
})
In ProjectsModel I have an action that ...
1
vote
2
answers
491
views
Update language using react-intl and mobx state tree
it's the first time I use react-intl with Mobx state tree.
Basically I have two buttons in the header (it and en) that on click set the current language saved in a Mobx State Tree variable.
Something ...
0
votes
0
answers
1k
views
How to modify/replace all the store in mobx-state-tree?
I am working on a React Native project and mobx state tree. I would like to modify the store every time I call a store action. For example:
const store = types.model({
user: types.maybe(User)
...
1
vote
1
answer
557
views
Observer does not work for recursive items
I'm really stuck with the problem. I have a nested menu. After click on the first menu level second level items shows up. After click on one of the children nothing happens. Looks like the observer ...
2
votes
1
answer
656
views
Is there any way to cancel previous async action in mobx-state-tree (Similar to takeLatest in redux-saga)
Currently, I am working on my react-native application using MST as a state management library.
Now I have encountered an issue where the app has a chance to fire 2 similar API calls. The 1st API ...
0
votes
1
answer
583
views
Ignite React Native Boilerplate Mobx State Tree initialize state
I am coming from redux and would like to change to the ignite boilerplate.
I have a boilerplate specific question: How do I initiliaze a store with an initialstate in Mobx?
I know how it conceptually ...
0
votes
1
answer
422
views
Mobx model type for hashmap
I want my model variable to look like
{
"foo": {
"viewed": false,
"url": "https://www.google.com"
},
"bar": {
"...
3
votes
1
answer
3k
views
How to populate mobx-state-tree map from existing object
This is a simplified version of my Store. I want to initialise it with data coming from json.
However, typescript keeps bothering me with errors.
const DistrictModel = types.model('District', {
id: ...