How do I get my current store outside of a react / component context?

[janniksam]

Is this possible? Can I access things in a store in middle of some business logic?

I haven't found any getStore methods or something similar. Only hooks.

[jmyrland]

Hey @janniksam !

Yes, this is possible. When you create your store instance (via createStore()) you can operate on this instance wherever you want to.

To access the state from the store instance, you have to call getState() and for actions getActions().

I've set up this sandbox to show a working example:

1. The store is created & exported from store/index.ts
2. The business.ts imports the store and exports a method to do some work.
3. main.js calls upon the method from business.ts. This should log the current state & add a todo to the list.

Hope that helps 👍

[janniksam]

Hey @jmyrland ,

thank you for the very quick response. 👍 :)

I am very new to the web world (and JS / TS in general), so I have a follow up (unrelated) question.

In the store.ts file I see a:

const store = createStore<TodosModel>(todosStore);

My reallife scenario looks a bit different, but it's pretty similar in general

export const MyStore = createStore<IContext>({
  accountInfo: accountInfo,
  myFees: fees,
  myOrders: orders,
  myTokens: myTokens,
  availablePools: availablePools,
  recentOrders: recentOrders,

  // thunks
  updateAccountRelated: thunk((a) => {
    a.myOrders.update();
    a.myFees.update();
    a.myTokens.update();
    a.recentOrders.update();
  }),
  clearAccountRelated: thunk((a) => {
    a.myOrders.clear();
    a.myFees.clear();
    a.myTokens.clear();
    a.recentOrders.clear();
  }),
});

The question, or lets say what I am confused about when it comes to Javascript:
If you import the store.ts file in two different other ts-files, will they not get each a different instance of that file? Will they share the same instance of that file and CreateStore only is called once instead of three times? Hope you get what I'm trying to say.

[jmyrland]

I think I get your question. Your wondering if the instance is regenerated for each separate import?

This is not the case, as you can see from the example.

1. The main.ts imports a reference to the store that it passes to the StoreProvider
2. The business.ts imports a reference to the same store instance, which it uses to add a Todo.

As you can see from the view after loading the page, it includes a Todo added via business.ts - proving that the imported store from main.ts and the imported store from business.ts are the same instance.

[janniksam]

Thank you. It works in my own code, everythings clear now👍