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
95
96
97
98
99
100
|
import { graphql } from 'react-apollo';
import {
REMOVE_FROM_CART_MUTATION,
ALL_ITEMS_QUERY,
REMOVE_ITEM_MUTATION,
SINGLE_ITEM_QUERY,
CURRENT_USER_QUERY,
ADD_TO_CART_MUTATION,
UPDATE_UI,
GET_UI_STATE,
TOGGLE_CART,
} from '../queries/index';
export const itemEnhancer = graphql(ALL_ITEMS_QUERY, {
name: 'itemsQuery',
options({ page }) {
return {
variables: {
skip: page * 3 - 3,
},
};
},
});
export const removeItemMutation = graphql(REMOVE_ITEM_MUTATION, {
name: 'removeItem',
options: {
update: (proxy, { data: { deleteItem } }) => {
// grab the data from our cache
const data = proxy.readQuery({ query: ALL_ITEMS_QUERY });
console.log(data);
// filter out the deleted item
data.items = data.items.filter(item => item.id !== deleteItem.id);
// and then "set state" (update cache), so it will update wherever we have used this data on the page
proxy.writeQuery({ query: ALL_ITEMS_QUERY, data });
},
},
});
export const singleItemEnhancer = graphql(SINGLE_ITEM_QUERY, {
name: 'findItem',
// This comes from Props
options: ({ id }) => ({
variables: { id },
}),
});
export const removeFromCartEnhancer = graphql(REMOVE_FROM_CART_MUTATION, {
name: 'removeFromCart',
options: {
update: (proxy, payload) => {
const data = proxy.readQuery({ query: CURRENT_USER_QUERY });
const cartItemId = payload.data.removeFromCart.id;
data.me.cart = data.me.cart.filter(item => item.id !== cartItemId);
proxy.writeQuery({ query: CURRENT_USER_QUERY, data });
},
},
});
export const addtoCartEnhancer = graphql(ADD_TO_CART_MUTATION, {
name: 'addToCart',
options: {
update: (proxy, payload) => {
const newCartItem = payload.data.addToCart;
const data = proxy.readQuery({ query: CURRENT_USER_QUERY });
const existingIndex = data.me.cart.findIndex(cartItem => cartItem.id === newCartItem.id);
if (existingIndex >= 0) {
// already in cache, just replace it
data.me.cart = [...data.me.cart.slice(0, existingIndex), newCartItem, ...data.me.cart.slice(existingIndex + 1)];
} else {
data.me.cart = [...data.me.cart, newCartItem];
}
proxy.writeQuery({ query: CURRENT_USER_QUERY, data });
},
},
});
export const userEnhancer = graphql(CURRENT_USER_QUERY, { name: 'currentUser' });
export const uiEnhancer = graphql(GET_UI_STATE, { name: 'ui' });
export const updateUIEnhancer = graphql(UPDATE_UI, {
props: data => ({
updateNetworkStatus: isConnected =>
data.mutate({
variables: {
...data.ownProps.ui.uiData,
isConnected,
},
}),
toggleCart: isCartOpen =>
data.mutate({
variables: {
...data.ownProps.ui.uiData,
isCartOpen,
},
}),
}),
});
|
