How to use the easy-peasy.action function in easy-peasy

{
    listenTo: 1,
  },
);

const listeningInvalidFunc: Action = action(
  (state, payload) => {
    state.logs.push(payload);
  },
  // typings:expect-error
  {
    listenTo: () => undefined,
  },
);

const multiListeningAction: Action = action(
  (state, payload) => {
    state.logs.push(payload);
  },
  {
    listenTo: [targetModel.doAction, targetModel.doThunk],
  },
);

const multiListeningActionInvalid: Action = action(
  (state, payload) => {
    state.logs.push(payload);
  },
  // typings:expect-error
  {
    listenTo: [targetModel.doAction, targetModel.doThunkInvalid],
  },

// typings:expect-error
  {
    listenTo: targetModel.doActionInvalid,
  },
);

const listeningThunk: Action = action(
  (state, payload) => {
    state.logs.push(payload);
  },
  {
    listenTo: targetModel.doThunk,
  },
);

const listeningThunkInvalidPayload: Action = action(
  (state, payload) => {
    state.logs.push(payload);
  },
  // typings:expect-error
  {
    listenTo: targetModel.doThunkInvalid,
  },
);

const listeningString: Action = action(
  (state, payload) => {
    state.logs.push(payload);
  },
  {
    listenTo: 'ADD_TODO',
  },

lastName: string;
}

interface SessionModel {
  user?: User;
  register: Action;
  unregister: Action;
  sessionListeners: ThunkOn;
}

const sessionModel: SessionModel = {
  user: undefined,
  register: action((state, payload) => {
    state.user = payload;
  }),
  unregister: action(state => {
    state.user = undefined;
  }),
  sessionListeners: thunkOn(
    actions => [actions.register, actions.unregister],
    (actions, target) => {
      const { payload } = target;
      if (payload == null) {
      } else {
        payload.firstName + payload.lastName;
      }
    },
  ),
};

// #endregion

// state properties
  networks: [],
  // computed properties/functions
  networkById: computed(state => (id?: string | number) => {
    const networkId = typeof id === 'number' ? id : parseInt(id || '');
    const network = state.networks.find(n => n.id === networkId);
    if (!network) {
      throw new Error(l('networkByIdErr', { networkId }));
    }
    return network;
  }),
  // reducer actions (mutations allowed thx to immer)
  setNetworks: action((state, networks) => {
    state.networks = networks;
  }),
  updateNodePorts: action((state, { id, ports }) => {
    const network = state.networks.find(n => n.id === id) as Network;
    network.nodes.bitcoin
      .filter(n => !!ports[n.name])
      .forEach(n => (n.ports = { ...n.ports, ...ports[n.name] }));
    network.nodes.lightning
      .filter(n => !!ports[n.name])
      .forEach(n => (n.ports = { ...n.ports, ...ports[n.name] }));
  }),
  load: thunk(async (actions, payload, { injections, getStoreActions }) => {
    const { networks, charts } = await injections.dockerService.loadNetworks();
    if (networks && networks.length) {
      actions.setNetworks(networks);
    }
    getStoreActions().designer.setAllCharts(charts);
  }),
  save: thunk(async (actions, payload, { getState, injections, getStoreState }) => {

export default {
  route: 'cart',
  // route: 'billing',
  open: false,
  // open: true,

  checkingOut: select(({ route }) => ['shipping', 'billing'].includes(route)),

  goToCart: changeRoute('cart'),
  goToShipping: changeRoute('shipping'),
  goToBilling: changeRoute('billing'),
  goToConfirmation: changeRoute('confirmation'),
  goToOrders: changeRoute('orders'),
  goToLogin: changeRoute('login'),

  toggle: action(state => {
    state.open = !state.open
  }),

  openCart: action(state => {
    state.open = true
    state.route = 'cart'
  }),

  closeModal: thunk(async (actions, _, { getStoreState, getState }) => {
    const { checkingOut } = await getState()
    const {
      checkout: { completed }
    } = await getStoreState()

    if (!completed && checkingOut) return

LightningModel,
    { node: LightningNode; balances: LightningNodeBalances }
  >;
  getBalances: Thunk;
}

const lightningModel: LightningModel = {
  // state properties
  nodes: {},
  // reducer actions (mutations allowed thx to immer)
  removeNode: action((state, name) => {
    if (state.nodes[name]) {
      delete state.nodes[name];
    }
  }),
  setInfo: action((state, { node, info }) => {
    if (!state.nodes[node.name]) state.nodes[node.name] = {};
    state.nodes[node.name].info = info;
  }),
  getInfo: thunk(async (actions, node, { injections }) => {
    const api = injections.lightningFactory.getService(node);
    const info = await api.getInfo(node);
    actions.setInfo({ node, info });
  }),
  setBalances: action((state, { node, balances }) => {
    if (!state.nodes[node.name]) state.nodes[node.name] = {};
    state.nodes[node.name].balances = balances;
  }),
  getBalances: thunk(async (actions, node, { injections }) => {
    const api = injections.lightningFactory.getService(node);
    const balances = await api.getBalances(node);
    actions.setBalances({ node, balances });

interface StoreModel {
  todos: TodosModel;
  user: UserModel;
  counter: Reducer;
  audit: AuditModel;
}

/**
 * Then you create your store.
 * Note that as we pass the Model into the `createStore` function, so all of our
 * model definition is typed correctly, including inside the actions/helpers etc.
 */
const userModel: UserModel = {
  token: undefined,
  loggedIn: action((state, payload) => {
    state.token = payload;
  }),
  login: thunk(async (actions, payload) => {
    const response = await fetch('/login', {
      method: 'POST',
      body: JSON.stringify(payload),
      headers: {
        'Content-Type': 'application/json',
      },
    });
    const { token } = await response.json();
    actions.loggedIn(token);
  }),
};
const store = createStore({
  audit: {

export interface FlashMessage {
    id?: string;
    key?: string;
    type: FlashMessageType;
    title?: string;
    message: string;
}

const flashes: FlashStore = {
    items: [],

    addFlash: action((state, payload) => {
        state.items.push(payload);
    }),

    addError: action((state, payload) => {
        state.items.push({ type: 'error', title: 'Error', ...payload });
    }),

    clearAndAddHttpError: action((state, { key, error }) => {
        state.items = [ { type: 'error', title: 'Error', key, message: httpErrorToHuman(error) } ];
    }),

    clearFlashes: action((state, payload) => {
        state.items = payload ? state.items.filter(flashes => flashes.key !== payload) : [];
    }),
};

export default flashes;

[key: string]: {
        description: string;
        keys: { [k: string]: string };
    };
}

export interface GloablPermissionsStore {
    data: PanelPermissions;
    setPermissions: Action;
    getPermissions: Thunk, any, Promise>;
}

const permissions: GloablPermissionsStore = {
    data: {},

    setPermissions: action((state, payload) => {
        state.data = payload;
    }),

    getPermissions: thunk(async (actions) => {
        const permissions = await getSystemPermissions();

        actions.setPermissions(permissions);
    }),
};

export default permissions;