createEntityStore Api like Database Action

[cqh963852]

I am looking for a eaiser api to create store like redux toolkit's createEntityAdapter.

type ID = string | number;
interface IData {
  id: ID;
}

export const $addOne = createEvent<IData>();
export const $removeOne = createEvent<ID>();

const $entityStore = createEntityStore<IData>()
  .on($addOne, (entityState, data) => {
    return entityState.addOne(data);
  })
  .on($removeOne, (entityState, id) => {
    return entityState.removeOne(id);
  });

export default $entityStore;

What about createEntityStore?

[cqh963852]

Another way.
I have fork redux-toolkit 's entity library

import { createEntityAdapter } from "@idealjs/entity";
import { createEvent, createStore } from "effector";

interface IUser {
  id: string;
  name: string;
}
const $addOne = createEvent<IUser>();
const $removeOne = createEvent<string>();

const entityAdapter = createEntityAdapter<IUser>();

const store = createStore(entityAdapter.getInitialState());

const $entityStore = store
  .on($addOne, (entityState, data) => {
    return entityAdapter.addOne(entityState, data);
  })
  .on($removeOne, (entityState, data) => {
    return entityAdapter.removeOne(entityState, data);
  });

It can also create entity data.

But redux-toolkit's entity need immer,reselect as deps.

[zerobias]

I think this is a great idea. The only difficulty in implementing this idea is the need for continuous feedback from people who test the implementation in practice, on real-world tasks. So that you can ask: "Is this convenient? What if we do this? What is causing difficulties?"

Not so long ago I tried to implement an api for working with collections (queries, filtering; most likely we will want to do more than just add and remove items, right?), but without feedback it was purely an abstract experiment.

Notice how the target UI looks like — the key trick is that the editable and collapsible tree squeezes the most out of the approach

And how would you implement such a task? I found that a lot of issues comes in an interaction between api itself and the view

[cqh963852]

queries, filtering; most likely we will want to do more than just add and remove items.

I agree with this.

---

I have learn the todos app.

The createItemApi is great,It looks like redux-toolkit 's createSlice Api, but easier than it.

While using redux-toolkit's createSlice, I have to do reexport. just like

createItemApi doesn't need reexport,

---

But it is quite complex.

what about

  const [todo, api] = useItem(id, todoItemApi)
  // =>
  // const todo = useItem(id,todoItemApi) // select the todo entity
  // const api = useItemApi(id,todoItemApi) // select the todo entity's api

In this case, an interface is only responsible for one function

And some time, The view and the control are placed at different component.

[zerobias]

I updated the example, useItem was split into useItemApi and useItemState and the files model and modelView were merged

[zerobias]

Eventually, it would be good to see this api as an official part of effector, effector/keyval or @effector/keyval. But there is still the unsolved issue: how to initialize an item as a child of another one — I struggled to properly get an ID of the parent