Merge pull request #1 from feathersjs-ecosystem/master

Sync with master

Author: JorgenVatle

.vscode/settings.json

@@ -8,11 +8,15 @@
     "lib/**": true,
     "**/node_modules": true,
     "**/bower_components": true,
-    "**/yarn.lock": true
+    "**/yarn.lock": true,
+    "**/package-lock.json": true
   },
   "workbench.colorCustomizations": {
     "activityBar.background": "#2B3011",
     "titleBar.activeBackground": "#3C4418",
     "titleBar.activeForeground": "#FAFBF4"
-  }
+  },
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "prettier.arrowParens": "avoid",
+  "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false
 }

docs/2.0-major-release.md

@@ -163,6 +163,8 @@ I have not been able to find a diffing algorithm that works equally well acroos
 
 ## Model Classes: BYOD (Bring Your Own Diffing)
 
+> Note: As of `[email protected]`, you can also pass `params.data` to the patch object to implement partial patching on objects.  You might choose to use `params.data` instead of `diffOnPatch`.
+
 First, why do any diffing?  On the API server, an `update` request replaces an entire object, but a `patch` request only overwrites the attributes that are provided in the data.  For services with simple schemas, it doesn't really matter.  But if your schema grows really large, it can be supportive to only send the updates instead of the entire object.
 
 A new `diffOnPatch` method is available to override in your extended models.  `diffOnPatch` gets called just before sending the data to the API server.  It gets called with the data and must return the diffed data.  By default, it is set to `diffOnPatch: data => data`.

docs/3.0-major-release.md

@@ -16,6 +16,21 @@ Version 3.0 of Feathers-Vuex is the Vue Composition API release!  There were qui
 
 And now it has become the best way to perform queries with Feathers-Vuex.  To find out how to take advantage of the new functionality in your apps, read the [Feather-Vuex Composition API docs](./composition-api.md).
 
+## Partial data on patch <Badge text="3.9.0+" />
+As of version 3.9.0, you can provide an object as `params.data`, and Feathers-Vuex will use `params.data` as the patch data.  This change was made to the service-module, itself, so it will work for `patch` across all of feathers-vuex.  Here's an example of patching with partial data:
+
+```js
+import { models } from 'feathers-vuex'
+const { Todo } = models.api
+
+const todo = new Todo({ description: 'Do Something', isComplete: false })
+
+todo.patch({ data: { isComplete: true } })
+
+// also works for patching with instance.save
+todo.save({ data: { isComplete: true } })
+```
+
 ## FeathersVuexPagination Component <Badge text="3.8.0+" />
 
 To assist with Server Side Pagination support, Feathers-Vuex now includes the `<FeathersVuexPagination>` component.  It's a renderless component that removes the boilerplate behind handling pagination in the UI.  Read about it in the [Composition API Docs](/composition-api.html#feathersvuexpagination).
@@ -69,14 +84,18 @@ This behavior exactly matches the new `useFind` utility.
 
 ## Deprecations
 
-### The `keepCopiesInStore` Option<Badge text="deprecated" type="warning"/>
+### The `keepCopiesInStore` Option <Badge text="deprecated" type="warning"/>
 
 The `keepCopiesInStore` option is now deprecated.  This was a part of the "clone and commit" API which basically disabled the reason for creating the "clone and commit" API in the first place.
 
 If you're not familiar with the Feathers-Vuex "clone and commit" API, you can learn more about the [built-in data modeling](./model-classes.md) API and the section about [Working with Forms](./feathers-vuex-forms.md#the-clone-and-commit-pattern).
 
 The `keepCopiesInStore` feature is set to be removed in Feathers-Vuex 4.0.
 
-### Auth Plugin State: `user`<Badge text="deprecated" type="warning"/>
+### Auth Plugin State: `user` <Badge text="deprecated" type="warning"/>
 
 As described, earlier on this page, since the Auth Plugin's `user` state is no longer reactive and has been replaced by a `user` getter that IS reactive, the `user` state will be removed in the Feathers-Vuex 4.0.
+
+### Renderless Data Components: `query`, `fetchQuery` and `temps` <Badge text="deprecated type="warning">
+
+To keep consistency with mixins and the composition API it's preferred to use `params` and `fetchParams` instead of the old `query` and `fetchQuery` for renderless data components. Also the `:temps="true"` is deprecated in favour of `:params="{ query: {}, temps: true }"`. This way additional params can be passed to the server if you need some more magic like `$populateParams`.

docs/common-patterns.md

@@ -278,6 +278,8 @@ class Post extends BaseModel {
 
 ## Relationships for Populated Data
 
+If you're looking for a great solution for populating data to work with Feathers-Vuex, check out [feathers-graph-populate](https://feathers-graph-populate.netlify.app/).
+
 A common task with almost any API is properly handling relationships between endpoints.  Imagine an API where you have `/todos` and `/users` services.  Each todo record can belong to a single user, so a todo has a `userId`.
 
 ```js

docs/composition-api.md

@@ -105,7 +105,7 @@ interface UseFindOptions {
   fetchParams?: Params | Ref<Params>
   queryWhen?: Ref<Function>
   qid?: string
-  lazy?: boolean
+  immediate?: boolean
 }
 ```
 
@@ -123,7 +123,7 @@ And here's a look at each individual property:
   - Explicitly returning `null` will prevent an API request from being made.
 - `queryWhen` must be a `computed` property which returns a `boolean`. It provides a logical separation for preventing API requests *outside* of the `params`.
 - `qid` allows you to specify a query identifier (used in the pagination data in the store).  This can also be set dynamically by returning a `qid` in the params.
-- `lazy`, which is `false` by default, determines if the internal `watch` should fire immediately.  Set `lazy: true` and the query will not fire immediately.  It will only fire on subsequent changes to the params.
+- `immediate`, which is `true` by default, determines if the internal `watch` should fire immediately.  Set `immediate: false` and the query will not fire immediately.  It will only fire on subsequent changes to the params.
 
 ### Returned Attributes
 
@@ -150,8 +150,8 @@ Let's look at the functionality that each one provides:
 
 - `items` is the list of results. By default, this list will be reactive, so if new items are created which match the query, they will show up in this list automagically.
 - `servicePath` is the FeathersJS service path that is used by the current model. This is mostly only useful for debugging.
-- `isFindPending` is a boolean that indicates if there is an active query.  It is set to `true` just before each outgoing request.  It is set to `false` after the response returns.  Bind to it in the UI to show an activity indicator to the user.
-- `haveBeenRequestedOnce` is a boolean that is set to `true` immediately before the first query is sent out.  It remains true throughout the life of the component.  This comes in handy for first-load scenarios in the UI.
+- `isPending` is a boolean that indicates if there is an active query.  It is set to `true` just before each outgoing request.  It is set to `false` after the response returns.  Bind to it in the UI to show an activity indicator to the user.
+- `haveBeenRequested` is a boolean that is set to `true` immediately before the first query is sent out.  It remains true throughout the life of the component.  This comes in handy for first-load scenarios in the UI.
 - `haveLoaded` is a boolean that is set to true after the first API response.  It remains `true` for the life of the component. This also comes in handy for first-load scenarios in the UI.
 - `isLocal` is a boolean that is set to true if this data is local only.
 - `qid` is currently the primary `qid` provided in params.  It might become more useful in the future.
@@ -208,7 +208,7 @@ If you have already used the `makeFindMixin`, the `useFind` composition function
 
 1. `useFind` is more TypeScript friendly. Since the mixins depended on adding dynamic attribute names that wouldn't overlap, TypeScript tooling and autocomplete weren't very effective.  The attributes returned from `useFind` are always consistent.
 1. Instead of providing a service name, you provide a service Model from the `$FeathersVuex` Vue plugin.
-1. The default behavior of `useFind` is to immediately query the API server. The `makeFindMixin`, by default, would wait until the watcher noticed the change.  This is to match the default behavior of `watch` in the Vue Composition API.  You can pass `{ lazy: true }` in the `useFind` options, which will be passed directly to the internal `watch` on the params.
+1. The default behavior of `useFind` is to immediately query the API server. The `makeFindMixin`, by default, would wait until the watcher noticed the change.  This is to match the default behavior of `watch` in the Vue Composition API.  You can pass `{ immediate: false }` in the `useFind` options, which will be passed directly to the internal `watch` on the params.
 
 Note that with the Vue Options API (aka the only way to write components in Vue 2.0) the models are found in `this.$FeathersVuex`.  With the Vue Composition API, this object is now at `context.root.$FeathersVuex`.
 
@@ -268,7 +268,7 @@ interface UseGetOptions {
   params?: Params | Ref<Params>
   queryWhen?: Ref<Function>
   local?: boolean
-  lazy?: boolean
+  immediate?: boolean
 }
 ```
 
@@ -281,7 +281,7 @@ And here's a look at each individual property:
 - `params` is a FeathersJS Params object OR a Composition API `ref` (or `computed`, since they return a `ref` instance) which returns a Params object.
   - Unlike the `useFind` utility, `useGet` does not currently have built-in debouncing.
 - `queryWhen` must be a `computed` property which returns a `boolean`. It provides a logical separation for preventing API requests apart from `null` in the `id`.
-- `lazy`, which is `false` by default, determines if the internal `watch` should fire immediately.  Set `lazy: true` and the query will not fire immediately.  It will only fire on subsequent changes to the `id` or `params`.
+- `immediate`, which is `true` by default, determines if the internal `watch` should fire immediately.  Set `immediate: false` and the query will not fire immediately.  It will only fire on subsequent changes to the `id` or `params`.
 
 ### Returned Attributes
 
@@ -779,6 +779,21 @@ export default new Router({
 
 Now, the `Post.vue` file only requires to have a `prop` named `id`.  Vue Router will pass the params from the route as props to the component.  See the [first useGet example](#useget) for a component that would work with the above route.  The vue-router documentation has more information about [Passing Props to Route Components](https://router.vuejs.org/guide/essentials/passing-props.html#passing-props-to-route-components)
 
+### Composing with Model types
+
+Both `useGet` and `useFind` have an optional type parameter for the Model type which is used as the type for the returned item(s).
+
+```ts
+// Destructure Model class from global models object
+const { User } = Vue.$FeathersVuex.api
+
+// use useGet with User Model
+useGet<typeof User.prototype>(/* ... */)
+
+// use useFind with User Model
+useFind<typeof User.prototype>(/* ... */)
+```
+
 ## Conventions for Development
 
 ### Params are Computed