netlify-cms-widget-async-select - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

dev/index.js

@@ -38,2 +38,3 @@ import './bootstrap.js';
               displayField: 'name',
+              searchField: 'name',
             },
@@ -40,0 +41,0 @@ ],

package.json

@@ -14,3 +14,3 @@ {
   ],
-  "version": "1.0.1",
+  "version": "1.1.0",
   "homepage": "https://github.com/chrisboustead/netlify-cms-widget-async-select",
@@ -35,2 +35,3 @@ "license": "MIT",
     "eslint-plugin-react": "^7.12.4",
+    "fuzzy": "^0.1.3",
     "html-webpack-plugin": "^3.2.0",
@@ -37,0 +38,0 @@ "immutable": "^3.7.6",

src/Control.js

@@ -8,2 +8,3 @@ import React from 'react';
 import { reactSelectStyles } from 'netlify-cms-ui-default';
+import fuzzy from 'fuzzy';
 
@@ -55,6 +56,7 @@ function optionToString(option) {
 
-  async getOptions() {
+  async getOptions(term) {
     const { field } = this.props;
     const valueField = field.get('valueField');
     const displayField = field.get('displayField') || valueField;
+    const searchField = field.get('searchField') || displayField;
     const url = field.get('url');
@@ -79,17 +81,20 @@ const method = field.get('method') || 'GET';
 
-    return mappedData
-      .map(entry => ({
-        value: entry.getIn(valueField.split('.')),
-        label: entry.getIn(displayField.split('.')),
-        data: entry,
-      }))
-      .toArray();
-  }
+    let mappedOptions = mappedData.map(entry => ({
+      value: entry.getIn(valueField.split('.')),
+      label: entry.getIn(displayField.split('.')),
+      data: entry,
+    }));
 
-  shouldComponentUpdate(nextProps) {
-    return (
-      this.props.value !== nextProps.value ||
-      this.props.hasActiveStyle !== nextProps.hasActiveStyle ||
-      this.props.queryHits !== nextProps.queryHits
-    );
+    if (term) {
+      mappedOptions = fuzzy
+        .filter(term, mappedOptions, {
+          extract: el => el.data.getIn(searchField.split('.')),
+        })
+        .sort((entryA, entryB) => entryB.score - entryA.score)
+        .map(entry => entry.original);
+    } else {
+      mappedOptions = mappedOptions.toArray();
+    }
+
+    return mappedOptions;
   }
@@ -165,3 +170,3 @@
   loadOptions = debounce((term, callback) => {
-    this.getOptions().then(options => {
+    this.getOptions(term).then(options => {
       if (!this.allOptions && !term) {
@@ -176,2 +181,4 @@ this.allOptions = options;
       callback(options);
+      // Refresh state to trigger a re-render.
+      this.setState({ ...this.state });
     });
@@ -178,0 +185,0 @@ }, 500);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3202221

increased by0.24%

Lines of code

3360

increased by0.36%

Worsened metrics

Dev dependency count

32

increased by3.23%

No dependency changes