-
Notifications
You must be signed in to change notification settings - Fork 5
/
AddTodoMutation.js
154 lines (140 loc) · 4.08 KB
/
AddTodoMutation.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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
// @flow
/**
* This file provided by Facebook is for non-commercial testing and evaluation
* purposes only. Facebook reserves all rights not expressly granted.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
* FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN
* ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
import {
commitMutation,
graphql,
type Disposable,
type Environment,
type RecordProxy,
type RecordSourceSelectorProxy,
} from 'react-relay-offline';
import {ConnectionHandler} from 'relay-runtime';
import type {TodoApp_user} from 'relay/TodoApp_user.graphql';
import type {AddTodoInput} from 'relay/AddTodoMutation.graphql';
import {v4 as uuid} from 'uuid';
const mutation = graphql`
mutation AddTodoMutation($input: AddTodoInput!) {
addTodo(input: $input) {
todoEdge {
__typename
cursor
node {
complete
id
text
}
}
user {
id
totalCount
}
}
}
`;
let tempID = 0;
function sharedUpdater(store, user, newEdge) {
// Get the current user record from the store
const userProxy = store.get(user.id);
// Get the user's Todo List using ConnectionHandler helper
const conn = ConnectionHandler.getConnection(
userProxy,
'TodoList_todos', // This is the connection identifier, defined here
// https://github.com/relayjs/relay-examples/blob/master/todo/js/components/TodoList.js#L76
);
// Insert the new todo into the Todo List connection
ConnectionHandler.insertEdgeAfter(conn, newEdge);
}
function commit(
environment: Environment,
text: string,
user: TodoApp_user,
): Disposable {
//const totalCount = user.totalCount + 1;
//const idTot = totalCount + user.completedCount;
const idTodo = uuid();
const input: AddTodoInput = {
clientMutationId: idTodo,
id: idTodo,
text,
userId: user.userId,
};
const totalCount = user.totalCount + 1;
const idTot = totalCount + user.completedCount;
/*
return commitMutation(environment, {
mutation,
variables: {
input,
},
optimisticResponse: {
addTodo: {
todoEdge: {
node: {
id: idTodo,
text: text,
complete: false
},
cursor: null,
__typename: "TodoEdge"
},
user: {
id: user.id,
totalCount: totalCount
}
}
},
configs: [{
type: 'RANGE_ADD',
parentID: user.id,
connectionInfo: [{
key: 'TodoList_todos',
rangeBehavior: 'append',
}],
edgeName: 'todoEdge',
}],
});*/
return commitMutation(environment, {
mutation,
variables: {
input,
},
onCompleted: data => {
console.log('onCompleted', data);
},
updater: store => {
// Get the payload returned from the server
const payload = store.getRootField('addTodo');
// Get the edge of the newly created Todo record
const newEdge = payload.getLinkedRecord('todoEdge');
// Add it to the user's todo list
sharedUpdater(store, user, newEdge);
},
optimisticUpdater: store => {
const id = idTodo;
const node = store.create(id, 'Todo');
node.setValue(false, 'complete');
node.setValue(text, 'text');
node.setValue(idTodo, 'id');
const newEdge = store.create('client:newEdge:' + idTodo, 'TodoEdge');
newEdge.setLinkedRecord(node, 'node');
newEdge.setValue(null, 'cursor');
// Add it to the user's todo list
sharedUpdater(store, user, newEdge);
// Given that we don't have a server response here,
// we also need to update the todo item count on the user
const userRecord = store.get(user.id);
userRecord.setValue(userRecord.getValue('totalCount') + 1, 'totalCount');
},
});
}
export default {commit};