This repository has been archived by the owner on Dec 30, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 157
/
widget.js
94 lines (90 loc) · 2.68 KB
/
widget.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
import { _objectSpread } from '../util/polyfills';
import { isVue3 } from '../util/vue-compat';
import { warn } from '../util/warn';
export const createWidgetMixin = (
{ connector } = {},
additionalProperties = {}
) => ({
inject: {
instantSearchInstance: {
from: '$_ais_instantSearchInstance',
default() {
const tag = this.$options._componentTag;
throw new TypeError(
`It looks like you forgot to wrap your Algolia search component "<${tag}>" inside of an "<ais-instant-search>" component.`
);
},
},
getParentIndex: {
from: '$_ais_getParentIndex',
default() {
return () => this.instantSearchInstance.mainIndex;
},
},
},
data() {
return {
state: null,
};
},
created() {
if (typeof connector === 'function') {
this.factory = connector(this.updateState, () => {});
this.widget = _objectSpread(
this.factory(this.widgetParams),
additionalProperties
);
this.getParentIndex().addWidgets([this.widget]);
if (
this.instantSearchInstance._initialResults &&
!this.instantSearchInstance.started
) {
if (typeof this.instantSearchInstance.__forceRender !== 'function') {
throw new Error(
'You are using server side rendering with <ais-instant-search> instead of <ais-instant-search-ssr>.'
);
}
this.instantSearchInstance.__forceRender(
this.widget,
this.getParentIndex()
);
}
} else if (connector !== true) {
warn(
`You are using the InstantSearch widget mixin, but didn't provide a connector.
While this is technically possible, and will give you access to the Helper,
it's not the recommended way of making custom components.
If you want to disable this message, pass { connector: true } to the mixin.
Read more on using connectors: https://alg.li/vue-custom`
);
}
},
[isVue3 ? 'beforeUnmount' : 'beforeDestroy']() {
if (this.widget) {
this.getParentIndex().removeWidgets([this.widget]);
}
},
watch: {
widgetParams: {
handler(nextWidgetParams) {
this.state = null;
this.getParentIndex().removeWidgets([this.widget]);
this.widget = _objectSpread(
this.factory(nextWidgetParams),
additionalProperties
);
this.getParentIndex().addWidgets([this.widget]);
},
deep: true,
},
},
methods: {
updateState(state = {}, isFirstRender) {
if (!isFirstRender) {
// Avoid updating the state on first render
// otherwise there will be a flash of placeholder data
this.state = state;
}
},
},
});