Skip to content

Commit f209f5d

Browse files
redoxredox
committed
fix(numerical widgets): s/facetName/attributeName
Fix #431 BREAKING CHANGE: the priceRanges and rangeSlider widgets are now using `attributeName` instead of `facetName`.
1 parent df373c3 commit f209f5d

File tree

8 files changed

+36
-36
lines changed

8 files changed

+36
-36
lines changed

‎dev/app.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,7 @@ search.addWidget(
151151
search.addWidget(
152152
instantsearch.widgets.rangeSlider({
153153
container: '#price',
154-
facetName: 'price',
154+
attributeName: 'price',
155155
cssClasses: {
156156
header: 'facet-title'
157157
},
@@ -189,7 +189,7 @@ search.once('render', function() {
189189
search.addWidget(
190190
instantsearch.widgets.priceRanges({
191191
container: '#price-ranges',
192-
facetName: 'price',
192+
attributeName: 'price',
193193
templates: {
194194
header: 'Price ranges'
195195
},

‎docs/_includes/widget-jsdoc/priceRanges.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
| Param | Description |
22
| --- | --- |
33
| <span class='attr-required'>`options.container`</span> | Valid CSS Selector as a string or DOMElement |
4-
| <span class='attr-required'>`options.facetName`</span> | Name of the attribute for faceting |
4+
| <span class='attr-required'>`options.attributeName`</span> | Name of the attribute for faceting |
55
| <span class='attr-optional'>`options.cssClasses`</span> | CSS classes to add |
66
| <span class='attr-optional'>`options.cssClasses.root`</span> | CSS class to add to the root element |
77
| <span class='attr-optional'>`options.cssClasses.header`</span> | CSS class to add to the header element |

‎docs/_includes/widget-jsdoc/rangeSlider.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
| Param | Description |
22
| --- | --- |
33
| <span class='attr-required'>`options.container`</span> | CSS Selector or DOMElement to insert the widget |
4-
| <span class='attr-required'>`options.facetName`</span> | Name of the attribute for faceting |
4+
| <span class='attr-required'>`options.attributeName`</span> | Name of the attribute for faceting |
55
| <span class='attr-optional'>`options.tooltips`</span> | Should we show tooltips or not. The default tooltip will show the formatted corresponding value without any other token. You can also provide tooltips: {format: function(formattedValue, rawValue) {return '$' + formattedValue}} So that you can format the tooltip display value as you want |
66
| <span class='attr-optional'>`options.templates`</span> | Templates to use for the widget |
77
| <span class='attr-optional'>`options.templates.header`</span> | Header template |

‎docs/documentation.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -583,7 +583,7 @@ This filtering widget lets the user choose either or not to filter values to `tr
583583
search.addWidget(
584584
instantsearch.widgets.rangeSlider({
585585
container: '#price',
586-
facetName: 'price',
586+
attributeName: 'price',
587587
templates: {
588588
header: 'Price'
589589
},
@@ -618,7 +618,7 @@ The range slider filters values of a single numeric attribute using 2 cursors: t
618618
search.addWidget(
619619
instantsearch.widgets.priceRanges({
620620
container: '#priceranges.widget-container',
621-
facetName: 'price',
621+
attributeName: 'price',
622622
labels: {
623623
currency: '$',
624624
separator: 'to',

‎widgets/price-ranges/__tests__/price-ranges-test.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ describe('priceRanges()', () => {
3333
priceRanges.__Rewire__('headerFooter', headerFooter);
3434

3535
container = document.createElement('div');
36-
widget = priceRanges({container, facetName: 'aFacetname'});
36+
widget = priceRanges({container, attributeName: 'aNumAttr'});
3737
results = {
3838
hits: [1],
3939
nbHits: 1,
@@ -47,7 +47,7 @@ describe('priceRanges()', () => {
4747
});
4848

4949
it('adds the attribute as a facet', () => {
50-
expect(widget.getConfiguration()).toEqual({facets: ['aFacetname']});
50+
expect(widget.getConfiguration()).toEqual({facets: ['aNumAttr']});
5151
});
5252

5353
context('without refinements', function() {

‎widgets/price-ranges/price-ranges.js

+13-13
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ let cx = require('classnames');
1515
/**
1616
* Instantiate a price ranges on a numerical facet
1717
* @param {string|DOMElement} options.container Valid CSS Selector as a string or DOMElement
18-
* @param {string} options.facetName Name of the attribute for faceting
18+
* @param {string} options.attributeName Name of the attribute for faceting
1919
* @param {Object} [options.cssClasses] CSS classes to add
2020
* @param {string} [options.cssClasses.root] CSS class to add to the root element
2121
* @param {string} [options.cssClasses.header] CSS class to add to the header element
@@ -42,7 +42,7 @@ let cx = require('classnames');
4242
*/
4343
function priceRanges({
4444
container,
45-
facetName,
45+
attributeName,
4646
cssClasses: userCssClasses = {},
4747
templates = defaultTemplates,
4848
labels = {
@@ -53,29 +53,29 @@ function priceRanges({
5353
hideContainerWhenNoResults = true
5454
}) {
5555
let containerNode = utils.getContainerNode(container);
56-
let usage = 'Usage: priceRanges({container, facetName, [cssClasses.{root,header,body,list,item,active,link,form,label,input,currency,separator,button,footer}, templates.{header,item,footer}, labels.{currency,separator,button}, hideContainerWhenNoResults]})';
56+
let usage = 'Usage: priceRanges({container, attributeName, [cssClasses.{root,header,body,list,item,active,link,form,label,input,currency,separator,button,footer}, templates.{header,item,footer}, labels.{currency,separator,button}, hideContainerWhenNoResults]})';
5757

5858
let PriceRanges = headerFooter(require('../../components/PriceRanges/PriceRanges'));
5959
if (hideContainerWhenNoResults === true) {
6060
PriceRanges = autoHideContainer(PriceRanges);
6161
}
6262

63-
if (!container || !facetName) {
63+
if (!container || !attributeName) {
6464
throw new Error(usage);
6565
}
6666

6767
return {
6868
getConfiguration: () => ({
69-
facets: [facetName]
69+
facets: [attributeName]
7070
}),
7171

7272
_generateRanges: function(results) {
73-
let stats = results.getFacetStats(facetName);
73+
let stats = results.getFacetStats(attributeName);
7474
return generateRanges(stats);
7575
},
7676

7777
_extractRefinedRange: function(helper) {
78-
let refinements = helper.getRefinements(facetName);
78+
let refinements = helper.getRefinements(attributeName);
7979
let from;
8080
let to;
8181

@@ -96,13 +96,13 @@ function priceRanges({
9696
_refine: function(helper, from, to) {
9797
let facetValues = this._extractRefinedRange(helper);
9898

99-
helper.clearRefinements(facetName);
99+
helper.clearRefinements(attributeName);
100100
if (facetValues.length === 0 || facetValues[0].from !== from || facetValues[0].to !== to) {
101101
if (typeof from !== 'undefined') {
102-
helper.addNumericRefinement(facetName, '>', from - 1);
102+
helper.addNumericRefinement(attributeName, '>', from - 1);
103103
}
104104
if (typeof to !== 'undefined') {
105-
helper.addNumericRefinement(facetName, '<', to + 1);
105+
helper.addNumericRefinement(attributeName, '<', to + 1);
106106
}
107107
}
108108

@@ -149,13 +149,13 @@ function priceRanges({
149149
ReactDOM.render(
150150
<PriceRanges
151151
createURL={(from, to, isRefined) => {
152-
let newState = state.clearRefinements(facetName);
152+
let newState = state.clearRefinements(attributeName);
153153
if (!isRefined) {
154154
if (typeof from !== 'undefined') {
155-
newState = newState.addNumericRefinement(facetName, '>', from - 1);
155+
newState = newState.addNumericRefinement(attributeName, '>', from - 1);
156156
}
157157
if (typeof to !== 'undefined') {
158-
newState = newState.addNumericRefinement(facetName, '<', to + 1);
158+
newState = newState.addNumericRefinement(attributeName, '<', to + 1);
159159
}
160160
}
161161
return createURL(newState);

‎widgets/range-slider/__tests__/range-slider-test.js

+6-6
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ describe('rangeSlider()', () => {
3333
rangeSlider.__Rewire__('headerFooter', headerFooter);
3434

3535
container = document.createElement('div');
36-
widget = rangeSlider({container, facetName: 'aFacetName'});
36+
widget = rangeSlider({container, attributeName: 'aNumAttr'});
3737
results = {
3838
getFacetStats: sinon.stub().returns({
3939
min: 1.99,
@@ -53,7 +53,7 @@ describe('rangeSlider()', () => {
5353
});
5454

5555
it('configures the disjunctiveFacets', () => {
56-
expect(widget.getConfiguration()).toEqual({disjunctiveFacets: ['aFacetName']});
56+
expect(widget.getConfiguration()).toEqual({disjunctiveFacets: ['aNumAttr']});
5757
});
5858

5959
it('calls twice ReactDOM.render(<Slider props />, container)', () => {
@@ -97,7 +97,7 @@ describe('rangeSlider()', () => {
9797
widget._refine(helper, stats, [stats.min + 1, stats.max]);
9898
expect(helper.clearRefinements.calledOnce).toBe(true, 'clearRefinements called once');
9999
expect(helper.addNumericRefinement.calledOnce).toBe(true, 'clearRefinements called once');
100-
expect(helper.addNumericRefinement.getCall(0).args).toEqual(['aFacetName', '>=', stats.min + 1]);
100+
expect(helper.addNumericRefinement.getCall(0).args).toEqual(['aNumAttr', '>=', stats.min + 1]);
101101
expect(helper.search.calledOnce).toBe(true, 'search called once');
102102
});
103103

@@ -106,7 +106,7 @@ describe('rangeSlider()', () => {
106106
widget._refine(helper, stats, [stats.min, stats.max - 1]);
107107
expect(helper.clearRefinements.calledOnce).toBe(true, 'clearRefinements called once');
108108
expect(helper.addNumericRefinement.calledOnce).toBe(true, 'addNumericRefinement called once');
109-
expect(helper.addNumericRefinement.getCall(0).args).toEqual(['aFacetName', '<=', stats.max - 1]);
109+
expect(helper.addNumericRefinement.getCall(0).args).toEqual(['aNumAttr', '<=', stats.max - 1]);
110110
expect(helper.search.calledOnce).toBe(true, 'search called once');
111111
});
112112

@@ -115,8 +115,8 @@ describe('rangeSlider()', () => {
115115
widget._refine(helper, stats, [stats.min + 1, stats.max - 1]);
116116
expect(helper.clearRefinements.calledOnce).toBe(true, 'clearRefinements called once');
117117
expect(helper.addNumericRefinement.calledTwice).toBe(true, 'addNumericRefinement called twice');
118-
expect(helper.addNumericRefinement.getCall(0).args).toEqual(['aFacetName', '>=', stats.min + 1]);
119-
expect(helper.addNumericRefinement.getCall(1).args).toEqual(['aFacetName', '<=', stats.max - 1]);
118+
expect(helper.addNumericRefinement.getCall(0).args).toEqual(['aNumAttr', '>=', stats.min + 1]);
119+
expect(helper.addNumericRefinement.getCall(1).args).toEqual(['aNumAttr', '<=', stats.max - 1]);
120120
expect(helper.search.calledOnce).toBe(true, 'search called once');
121121
});
122122

‎widgets/range-slider/range-slider.js

+9-9
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ let defaultTemplates = {
1313
/**
1414
* Instantiate a slider based on a numeric attribute
1515
* @param {string|DOMElement} options.container CSS Selector or DOMElement to insert the widget
16-
* @param {string} options.facetName Name of the attribute for faceting
16+
* @param {string} options.attributeName Name of the attribute for faceting
1717
* @param {boolean|Object} [options.tooltips=true] Should we show tooltips or not.
1818
* The default tooltip will show the formatted corresponding value without any other token.
1919
* You can also provide
@@ -30,7 +30,7 @@ let defaultTemplates = {
3030
*/
3131
function rangeSlider({
3232
container = null,
33-
facetName = null,
33+
attributeName = null,
3434
tooltips = true,
3535
templates = defaultTemplates,
3636
cssClasses = {
@@ -48,11 +48,11 @@ function rangeSlider({
4848

4949
return {
5050
getConfiguration: () => ({
51-
disjunctiveFacets: [facetName]
51+
disjunctiveFacets: [attributeName]
5252
}),
5353
_getCurrentRefinement(helper) {
54-
let min = helper.state.getNumericRefinement(facetName, '>=');
55-
let max = helper.state.getNumericRefinement(facetName, '<=');
54+
let min = helper.state.getNumericRefinement(attributeName, '>=');
55+
let max = helper.state.getNumericRefinement(attributeName, '<=');
5656

5757
if (min && min.length) {
5858
min = min[0];
@@ -72,17 +72,17 @@ function rangeSlider({
7272
};
7373
},
7474
_refine(helper, stats, newValues) {
75-
helper.clearRefinements(facetName);
75+
helper.clearRefinements(attributeName);
7676
if (newValues[0] > stats.min) {
77-
helper.addNumericRefinement(facetName, '>=', newValues[0]);
77+
helper.addNumericRefinement(attributeName, '>=', newValues[0]);
7878
}
7979
if (newValues[1] < stats.max) {
80-
helper.addNumericRefinement(facetName, '<=', newValues[1]);
80+
helper.addNumericRefinement(attributeName, '<=', newValues[1]);
8181
}
8282
helper.search();
8383
},
8484
render({results, helper, templatesConfig}) {
85-
let stats = results.getFacetStats(facetName);
85+
let stats = results.getFacetStats(attributeName);
8686

8787
let currentRefinement = this._getCurrentRefinement(helper);
8888

0 commit comments

Comments
 (0)