feat: filtering for relation widget (#2405)

[JimmyOei]

Summary

This PR adds a filters field for the Relation widget which allows adding filters by which the available options are filtered on. This was requested in issue #2405 (and also by myself :)).

How it works is that you can add "filters" which are a pair of field and the allowed values, where the widget will only show options (collection items) that satisfy all the "filters". An collection item satisfies a filter if the value of field is one of the values in values.

Example

collections:
  - name: posts
    label: Posts
    folder: _posts
    create: true
    fields:
      - label: Title
        name: title
        widget: string
      - label: Draft
        name: draft
        widget: boolean
        default: true
      - label: Body
        name: body
        widget: markdown
  - name: restaurants
    label: Restaurants
    folder: _restaurants
    create: true
    fields:
      - label: Title
        name: title
        widget: string
      - label: Body
        name: body
        widget: markdown
      - label: Posts
        name: posts
        widget: relation
        collection: posts
        multiple: true
        search_fields: [title]
        display_fields: [title]
        value_field: '{{slug}}'
        filters: 
          - field: draft
            values: [false]

In this example the relation widget in the restaurants collection will only show and allow options that are posts which are not a draft (i.e. draftfield is false). Say, we have 20 posts in the CMS of which 5 have draft set to true, then we will only see the other 15 posts as option in the relation widget.

Multiple filters can be added:

filters: 
  - field: draft
    values: [false]
  - field: title
     values: ['post about cats', 'post about dogs']

In this case only the posts with draft set to false and a title that is either 'posts about cats' or 'post about dogs' will be options seen in the relation widget.

Test plan

Added the following unit tests:

with filter
      ✓ should list the 10 out of 20 option hits on initial load using a filter on boolean value (532 ms)
      ✓ should list the 5 out of 20 option hits on initial load using a filter on string value (528 ms)
      ✓ should list 4 out of 20 option hits on initial load using multiple filters (523 ms)
      ✓ should list 0 out of 20 option hits on initial load on conflicting filter values (25 ms)

After adding the following filter to the dev-test config.yml: filters: [ {field: "draft", values: [false]} ] These are the results of the filter:

• Out of the 23 posts items that are in the posts collection by default in the dev-test cms, the filter on draft with value false gives the following possible options: (note that without the filter you would see posts 1 to 20 by default)

  

• Choosing, deleting, clearing options works the same:

  

Checklist

Please add a x inside each checkbox:

• [x] I have read the contribution guidelines.

A picture of a cute animal (not mandatory but encouraged) my 15 week old pup :)

[demshy]

This is so cool, kudos for adding e2e tests! I'd release this along with two other PR's this week. @martinjagodic would you mind helping with the docs update?

[demshy]

released as decap-cms@3.1.5