Skip to content

Commit e0f7dc6

Browse files
Merge pull request #407 from J3m5/mixin-local
improvement(mixin): keep the find method available even when the local option is set, fix #394,
2 parents 14c8305 + b7ca538 commit e0f7dc6

File tree

3 files changed

+163
-149
lines changed

3 files changed

+163
-149
lines changed

src/make-find-mixin.ts

Lines changed: 78 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,15 @@ no-console: 0,
44
@typescript-eslint/explicit-function-return-type: 0,
55
@typescript-eslint/no-explicit-any: 0
66
*/
7+
8+
import debounce from 'lodash/debounce'
9+
import _get from 'lodash/get'
710
import {
8-
getServicePrefix,
9-
getServiceCapitalization,
11+
getItemsFromQueryInfo,
1012
getQueryInfo,
11-
getItemsFromQueryInfo
13+
getServiceCapitalization,
14+
getServicePrefix
1215
} from './utils'
13-
import debounce from 'lodash/debounce'
14-
import _get from 'lodash/get'
1516

1617
export default function makeFindMixin(options) {
1718
const {
@@ -179,46 +180,44 @@ export default function makeFindMixin(options) {
179180
fetchParams: this[FETCH_PARAMS]
180181
})
181182

182-
if (!this[LOCAL]) {
183-
const shouldExecuteQuery =
184-
typeof this[QUERY_WHEN] === 'function'
185-
? this[QUERY_WHEN](paramsToUse)
186-
: this[QUERY_WHEN]
183+
const shouldExecuteQuery =
184+
typeof this[QUERY_WHEN] === 'function'
185+
? this[QUERY_WHEN](paramsToUse)
186+
: this[QUERY_WHEN]
187187

188-
if (shouldExecuteQuery) {
189-
if (paramsToUse) {
190-
// Set the qid.
191-
paramsToUse.query = paramsToUse.query || {}
192-
paramsToUse.qid = paramsToUse.qid || this[QID]
193-
this[QID] = paramsToUse.qid
188+
if (shouldExecuteQuery) {
189+
if (paramsToUse) {
190+
// Set the qid.
191+
paramsToUse.query = paramsToUse.query || {}
192+
paramsToUse.qid = paramsToUse.qid || this[QID]
193+
this[QID] = paramsToUse.qid
194194

195-
this[IS_FIND_PENDING] = true
196-
this[HAVE_ITEMS_BEEN_REQUESTED_ONCE] = true
195+
this[IS_FIND_PENDING] = true
196+
this[HAVE_ITEMS_BEEN_REQUESTED_ONCE] = true
197197

198-
return this.$store
199-
.dispatch(`${serviceName}/find`, paramsToUse)
200-
.then(response => {
201-
// To prevent thrashing, only clear ERROR on response, not on initial request.
202-
this[ERROR] = null
198+
return this.$store
199+
.dispatch(`${serviceName}/find`, paramsToUse)
200+
.then(response => {
201+
// To prevent thrashing, only clear ERROR on response, not on initial request.
202+
this[ERROR] = null
203203

204-
this[HAVE_ITEMS_LOADED_ONCE] = true
205-
const queryInfo = getQueryInfo(paramsToUse, response)
206-
queryInfo.response = response
207-
queryInfo.isOutdated = false
204+
this[HAVE_ITEMS_LOADED_ONCE] = true
205+
const queryInfo = getQueryInfo(paramsToUse, response)
206+
queryInfo.response = response
207+
queryInfo.isOutdated = false
208208

209-
this[MOST_RECENT_QUERY] = queryInfo
210-
this[IS_FIND_PENDING] = false
211-
return response
212-
})
213-
.catch(error => {
214-
this[ERROR] = error
215-
return error
216-
})
217-
}
218-
} else {
219-
if (this[MOST_RECENT_QUERY]) {
220-
this[MOST_RECENT_QUERY].isOutdated = true
221-
}
209+
this[MOST_RECENT_QUERY] = queryInfo
210+
this[IS_FIND_PENDING] = false
211+
return response
212+
})
213+
.catch(error => {
214+
this[ERROR] = error
215+
return error
216+
})
217+
}
218+
} else {
219+
if (this[MOST_RECENT_QUERY]) {
220+
this[MOST_RECENT_QUERY].isOutdated = true
222221
}
223222
}
224223
},
@@ -232,54 +231,59 @@ export default function makeFindMixin(options) {
232231
return { queryInfo, pageInfo }
233232
}
234233
},
235-
created() {
236-
debug &&
237-
console.log(
238-
`running 'created' hook in makeFindMixin for service "${service}" (using name ${nameToUse}")`
239-
)
240-
debug && console.log(PARAMS, this[PARAMS])
241-
debug && console.log(FETCH_PARAMS, this[FETCH_PARAMS])
234+
// add the created hook only if the local option is falsy
235+
...(!local && {
236+
created() {
237+
if (debug) {
238+
console.log(
239+
`running 'created' hook in makeFindMixin for service "${service}" (using name ${nameToUse}")`
240+
)
241+
console.log(PARAMS, this[PARAMS])
242+
console.log(FETCH_PARAMS, this[FETCH_PARAMS])
243+
}
242244

243-
const pType = Object.getPrototypeOf(this)
245+
const pType = Object.getPrototypeOf(this)
244246

245-
if (pType.hasOwnProperty(PARAMS) || pType.hasOwnProperty(FETCH_PARAMS)) {
246-
watch.forEach(prop => {
247-
if (typeof prop !== 'string') {
248-
throw new Error(`Values in the 'watch' array must be strings.`)
249-
}
250-
prop = prop.replace('params', PARAMS)
247+
if (
248+
pType.hasOwnProperty(PARAMS) ||
249+
pType.hasOwnProperty(FETCH_PARAMS)
250+
) {
251+
watch.forEach(prop => {
252+
if (typeof prop !== 'string') {
253+
throw new Error(`Values in the 'watch' array must be strings.`)
254+
}
255+
prop = prop.replace('params', PARAMS)
251256

252-
if (pType.hasOwnProperty(FETCH_PARAMS)) {
253-
if (prop.startsWith(PARAMS)) {
254-
prop = prop.replace(PARAMS, FETCH_PARAMS)
257+
if (pType.hasOwnProperty(FETCH_PARAMS)) {
258+
if (prop.startsWith(PARAMS)) {
259+
prop = prop.replace(PARAMS, FETCH_PARAMS)
260+
}
255261
}
256-
}
257-
this.$watch(prop, function() {
258-
// If the request is going to be debounced, set IS_FIND_PENDING to true.
259-
// Without this, there's not a way to show a loading indicator during the debounce timeout.
260-
const paramsToUse = getParams({
261-
providedParams: null,
262-
params: this[PARAMS],
263-
fetchParams: this[FETCH_PARAMS]
262+
this.$watch(prop, function() {
263+
// If the request is going to be debounced, set IS_FIND_PENDING to true.
264+
// Without this, there's not a way to show a loading indicator during the debounce timeout.
265+
const paramsToUse = getParams({
266+
providedParams: null,
267+
params: this[PARAMS],
268+
fetchParams: this[FETCH_PARAMS]
269+
})
270+
if (paramsToUse && paramsToUse.debounce) {
271+
this[IS_FIND_PENDING] = true
272+
}
273+
return this[`${FIND_ACTION}DebouncedProxy`]()
264274
})
265-
if (paramsToUse && paramsToUse.debounce) {
266-
this[IS_FIND_PENDING] = true
267-
}
268-
return this[`${FIND_ACTION}DebouncedProxy`]()
269275
})
270-
})
271276

272-
return this[FIND_ACTION]()
273-
} else {
274-
if (!local) {
277+
return this[FIND_ACTION]()
278+
} else {
275279
// TODO: Add this message to the logging:
276280
// "Pass { local: true } to disable this warning and only do local queries."
277281
console.log(
278282
`No "${PARAMS}" or "${FETCH_PARAMS}" attribute was found in the makeFindMixin for the "${service}" service (using name "${nameToUse}"). No queries will be made.`
279283
)
280284
}
281285
}
282-
}
286+
})
283287
}
284288

285289
function hasSomeAttribute(vm, ...attributes) {

src/make-get-mixin.ts

Lines changed: 59 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -95,75 +95,77 @@ export default function makeFindMixin(options) {
9595
const paramsToUse = params || this[FETCH_PARAMS] || this[PARAMS]
9696
const idToUse = id || this[ID]
9797

98-
if (!this[LOCAL]) {
99-
if (this[QUERY_WHEN]) {
100-
this[IS_GET_PENDING] = true
101-
this[HAS_ITEM_BEEN_REQUESTED_ONCE] = true
102-
103-
if (idToUse != null) {
104-
return this.$store
105-
.dispatch(`${this[SERVICE_NAME]}/get`, [idToUse, paramsToUse])
106-
.then(response => {
107-
// To prevent thrashing, only clear ERROR on response, not on initial request.
108-
this[ERROR] = null
109-
110-
this[HAS_ITEM_LOADED_ONCE] = true
111-
this[IS_GET_PENDING] = false
112-
return response
113-
})
114-
.catch(error => {
115-
this[ERROR] = error
116-
return error
117-
})
118-
}
98+
if (this[QUERY_WHEN]) {
99+
this[IS_GET_PENDING] = true
100+
this[HAS_ITEM_BEEN_REQUESTED_ONCE] = true
101+
102+
if (idToUse != null) {
103+
return this.$store
104+
.dispatch(`${this[SERVICE_NAME]}/get`, [idToUse, paramsToUse])
105+
.then(response => {
106+
// To prevent thrashing, only clear ERROR on response, not on initial request.
107+
this[ERROR] = null
108+
109+
this[HAS_ITEM_LOADED_ONCE] = true
110+
this[IS_GET_PENDING] = false
111+
return response
112+
})
113+
.catch(error => {
114+
this[ERROR] = error
115+
return error
116+
})
119117
}
120118
}
121119
}
122120
},
123-
created() {
124-
debug &&
125-
console.log(
126-
`running 'created' hook in makeGetMixin for service "${service}" (using name ${nameToUse}")`
127-
)
128-
debug && console.log(ID, this[ID])
129-
debug && console.log(PARAMS, this[PARAMS])
130-
debug && console.log(FETCH_PARAMS, this[FETCH_PARAMS])
131-
132-
const pType = Object.getPrototypeOf(this)
133-
134-
if (
135-
this.hasOwnProperty(ID) ||
136-
pType.hasOwnProperty(ID) ||
137-
pType.hasOwnProperty(PARAMS) ||
138-
pType.hasOwnProperty(FETCH_PARAMS)
139-
) {
140-
if (!watch.includes(ID)) {
141-
watch.push(ID)
121+
// add the created lifecycle hook only if local option is falsy
122+
...(!local && {
123+
created() {
124+
if (debug) {
125+
console.log(
126+
`running 'created' hook in makeGetMixin for service "${service}" (using name ${nameToUse}")`
127+
)
128+
console.log(ID, this[ID])
129+
console.log(PARAMS, this[PARAMS])
130+
console.log(FETCH_PARAMS, this[FETCH_PARAMS])
142131
}
143132

144-
watch.forEach(prop => {
145-
if (typeof prop !== 'string') {
146-
throw new Error(`Values in the 'watch' array must be strings.`)
133+
const pType = Object.getPrototypeOf(this)
134+
135+
if (
136+
this.hasOwnProperty(ID) ||
137+
pType.hasOwnProperty(ID) ||
138+
pType.hasOwnProperty(PARAMS) ||
139+
pType.hasOwnProperty(FETCH_PARAMS)
140+
) {
141+
if (!watch.includes(ID)) {
142+
watch.push(ID)
147143
}
148-
prop = prop.replace('query', PARAMS)
149144

150-
if (pType.hasOwnProperty(FETCH_PARAMS)) {
151-
if (prop.startsWith(PARAMS)) {
152-
prop.replace(PARAMS, FETCH_PARAMS)
145+
watch.forEach(prop => {
146+
if (typeof prop !== 'string') {
147+
throw new Error(`Values in the 'watch' array must be strings.`)
153148
}
154-
}
155-
this.$watch(prop, function () {
156-
return this[GET_ACTION]()
149+
prop = prop.replace('query', PARAMS)
150+
151+
if (pType.hasOwnProperty(FETCH_PARAMS)) {
152+
if (prop.startsWith(PARAMS)) {
153+
prop.replace(PARAMS, FETCH_PARAMS)
154+
}
155+
}
156+
this.$watch(prop, function() {
157+
return this[GET_ACTION]()
158+
})
157159
})
158-
})
159160

160-
return this[GET_ACTION]()
161-
} else {
162-
console.log(
163-
`No "${ID}", "${PARAMS}" or "${FETCH_PARAMS}" attribute was found in the makeGetMixin for the "${service}" service (using name "${nameToUse}"). No queries will be made.`
164-
)
161+
return this[GET_ACTION]()
162+
} else {
163+
console.log(
164+
`No "${ID}", "${PARAMS}" or "${FETCH_PARAMS}" attribute was found in the makeGetMixin for the "${service}" service (using name "${nameToUse}"). No queries will be made.`
165+
)
166+
}
165167
}
166-
}
168+
})
167169
}
168170

169171
function hasSomeAttribute(vm, ...attributes) {

0 commit comments

Comments
 (0)