How to properly use/type this when using debounced actions

[spaceemotion]

I am trying to debounce an action (using the ts-debounce package).

The problem I am an encountering is that this only seems to work in the first level:

actions: {
  // like so
  foo() {
    this.baz = 123;
  },

  // or so
  foo: function () {
    this.baz = 123;
  }
}

but not when using a "wrapper" for the action:

actions: {
  foo: debounce(function bar() {
    this.baz = [];
  }),
}

'this' implicitly has type 'any' because it does not have a type annotation.ts(2683)
store.ts(56, 28): An outer value of 'this' is shadowed by this container.

Even if I try to set the this type by hand, I run into a chicken-egg problem:

{
  foo: debounce(function bar(this: typeof useStore) {
   this.baz = []; // this is any
  }),
}

Is there a way to fix these types? Many thanks in advance!

[posva]

The ts-debounce library seems to have the necessary code to infer this when given a function but given the type definitions that enable automatic this inference in Pinia by directly writing the functions in actions, I don't think there is a way to automatically type this when using

actions: {
  foo: debounce(function bar() {
    this.baz = [];
  }),
}

However, with the WIP plugin API (#416), one could add a plugin that reads an option debounce:

defineStore({
  actions: { foo() {} }
  // autocompletion would be possible as well
  denounce: {
    foo: 300 // ms
  }
})

and a plugin that replaces actions to be denounced:

pinia.use(({ store, options }) => {
  if (options.debounce) {
    return Object.keys(options.debounce).reduce((debouncedActions, action) => {
      debouncedActions[action] = debounce(store[action], options.debounce[action])
      return debouncedActions
    }, {})
  }
})

Definitely worth adding a cookbook entry once I get a first version of the plugin API out

[posva]

BTW: I added this one as a test https://github.com/posva/pinia/blob/v2/test-dts/customizations.test-d.ts#L63