From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Wed, 31 Mar 2021 10:05:55 +0000 (+0200)
Subject: fix(types): pass custom properties to stores
X-Git-Tag: v2.0.0-alpha.9~1
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=d26df6e1133fc8dff58312df36ff2af6f129a560;p=thirdparty%2Fvuejs%2Fpinia.git

fix(types): pass custom properties to stores
---

diff --git a/__tests__/storePlugins.spec.ts b/__tests__/storePlugins.spec.ts
index fbfca39f..25508c74 100644
--- a/__tests__/storePlugins.spec.ts
+++ b/__tests__/storePlugins.spec.ts
@@ -11,7 +11,21 @@ declare module '../src' {
 }
 
 describe('store plugins', () => {
-  const useStore = defineStore({ id: 'test' })
+  const useStore = defineStore({
+    id: 'test',
+
+    actions: {
+      incrementN() {
+        return this.n++
+      },
+    },
+
+    getters: {
+      doubleN() {
+        return this.n * 2
+      },
+    },
+  })
   it('adds properties to stores', () => {
     const pinia = createPinia()
 
@@ -26,6 +40,8 @@ describe('store plugins', () => {
 
     expect(store.n).toBe(20)
     expect(store.uid).toBeDefined()
+    // @ts-expect-error: n is a number
+    store.n.notExisting
   })
 
   it('can install plugins before installing pinia', () => {
@@ -44,4 +60,33 @@ describe('store plugins', () => {
     expect(store.uid).toBeDefined()
     expect(store.hasApp).toBe(true)
   })
+
+  it('can be used in actions', () => {
+    const pinia = createPinia()
+
+    // must call use after installing the plugin
+    pinia.use(() => {
+      return { n: 20 }
+    })
+
+    mount({ template: 'none' }, { global: { plugins: [pinia] } })
+
+    const store = useStore(pinia)
+
+    expect(store.incrementN()).toBe(20)
+  })
+
+  it('can be used in getters', () => {
+    const pinia = createPinia()
+
+    // must call use after installing the plugin
+    pinia.use(() => {
+      return { n: 20 }
+    })
+
+    mount({ template: 'none' }, { global: { plugins: [pinia] } })
+
+    const store = useStore(pinia)
+    expect(store.doubleN).toBe(40)
+  })
 })
diff --git a/docs/introduction.md b/docs/introduction.md
index d9f5a70f..46bcea17 100644
--- a/docs/introduction.md
+++ b/docs/introduction.md
@@ -83,3 +83,5 @@ export const todos = defineStore({
   },
 })
 ```
+
+## Comparison with other
diff --git a/src/index.ts b/src/index.ts
index 2db614d8..718d9f8e 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -3,7 +3,6 @@ export {
   createPinia,
   Pinia,
   PiniaStorePlugin,
-  PiniaCustomProperties,
 } from './rootStore'
 export { defineStore } from './store'
 export {
@@ -12,6 +11,7 @@ export {
   StoreWithGetters,
   StoreWithActions,
   StoreWithState,
+  PiniaCustomProperties,
 } from './types'
 
 // TODO: remove in beta
diff --git a/src/rootStore.ts b/src/rootStore.ts
index 9ca316aa..492d755d 100644
--- a/src/rootStore.ts
+++ b/src/rootStore.ts
@@ -1,6 +1,11 @@
 import { App, InjectionKey, Plugin, Ref, ref, warn } from 'vue'
 import { IS_CLIENT } from './env'
-import { StateTree, StoreWithState, StateDescriptor } from './types'
+import {
+  StateTree,
+  StoreWithState,
+  StateDescriptor,
+  PiniaCustomProperties,
+} from './types'
 
 /**
  * setActivePinia must be called to handle SSR at the top of functions like
@@ -148,8 +153,3 @@ export function createPinia(): Pinia {
 
   return pinia
 }
-
-/**
- * Properties that are added to every store by `pinia.use()`
- */
-export interface PiniaCustomProperties {}
diff --git a/src/store.ts b/src/store.ts
index 4b6a2a4a..bbc83308 100644
--- a/src/store.ts
+++ b/src/store.ts
@@ -10,6 +10,7 @@ import {
   StoreWithActions,
   StateDescriptor,
   Method,
+  PiniaCustomProperties,
 } from './types'
 import {
   getActivePinia,
@@ -18,7 +19,6 @@ import {
   getClientApp,
   piniaSymbol,
   Pinia,
-  PiniaCustomProperties,
 } from './rootStore'
 import { addDevtools } from './devtools'
 import { IS_CLIENT } from './env'
@@ -247,9 +247,16 @@ export function defineStore<
 >(options: {
   id: Id
   state?: () => S
-  getters?: G & ThisType<S & StoreWithGetters<G>>
+  getters?: G & ThisType<S & StoreWithGetters<G> & PiniaCustomProperties>
   // allow actions use other actions
-  actions?: A & ThisType<A & S & StoreWithState<Id, S> & StoreWithGetters<G>>
+  actions?: A &
+    ThisType<
+      A &
+        S &
+        StoreWithState<Id, S> &
+        StoreWithGetters<G> &
+        PiniaCustomProperties
+    >
 }) {
   const { id, state, getters, actions } = options
 
diff --git a/src/types.ts b/src/types.ts
index eee9dd3a..9e72b144 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -136,7 +136,11 @@ export type Store<
   S extends StateTree,
   G,
   A
-> = StoreWithState<Id, S> & S & StoreWithGetters<G> & StoreWithActions<A>
+> = StoreWithState<Id, S> &
+  S &
+  StoreWithGetters<G> &
+  StoreWithActions<A> &
+  PiniaCustomProperties
 
 /**
  * Generic store type
@@ -147,3 +151,8 @@ export type GenericStore = Store<
   Record<string, Method>,
   Record<string, Method>
 >
+
+/**
+ * Properties that are added to every store by `pinia.use()`
+ */
+export interface PiniaCustomProperties {}