@nyaruka/temba-components 0.84.0 → 0.85.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/temba-components.js +6 -6
- package/dist/temba-components.js.map +1 -1
- package/out-tsc/src/templates/TemplateEditor.js +31 -30
- package/out-tsc/src/templates/TemplateEditor.js.map +1 -1
- package/out-tsc/test/temba-template-editor.test.js +5 -5
- package/out-tsc/test/temba-template-editor.test.js.map +1 -1
- package/package.json +1 -1
- package/screenshots/truth/templates/default.png +0 -0
- package/screenshots/truth/templates/french.png +0 -0
- package/src/templates/TemplateEditor.ts +40 -34
- package/static/api/templates.json +113 -172
- package/test/temba-template-editor.test.ts +5 -5
|
@@ -3,100 +3,49 @@
|
|
|
3
3
|
"previous": null,
|
|
4
4
|
"results": [
|
|
5
5
|
{
|
|
6
|
-
"uuid": "
|
|
7
|
-
"name": "
|
|
6
|
+
"uuid": "6beaf078-3bf1-4acb-9eb0-9c8b87641b2e",
|
|
7
|
+
"name": "Reservation Confirmation",
|
|
8
8
|
"translations": [
|
|
9
9
|
{
|
|
10
10
|
"channel": {
|
|
11
|
-
"uuid": "
|
|
11
|
+
"uuid": "f9f488a9-cfcd-4d52-9038-313d1e8b2da5",
|
|
12
12
|
"name": "WhatsApp"
|
|
13
13
|
},
|
|
14
14
|
"namespace": "",
|
|
15
15
|
"locale": "eng-US",
|
|
16
|
-
"status": "
|
|
16
|
+
"status": "pending",
|
|
17
17
|
"components": [
|
|
18
18
|
{
|
|
19
19
|
"name": "body",
|
|
20
20
|
"type": "body",
|
|
21
|
-
"content": "Hi bob {{1}} from {{2}}",
|
|
22
|
-
"params": [
|
|
23
|
-
{
|
|
24
|
-
"type": "text"
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
"type": "text"
|
|
28
|
-
}
|
|
29
|
-
]
|
|
30
|
-
},
|
|
31
|
-
{
|
|
32
|
-
"name": "buttons.0",
|
|
33
|
-
"type": "button/quick_reply",
|
|
34
|
-
"content": "Yes",
|
|
35
|
-
"params": []
|
|
36
|
-
},
|
|
37
|
-
{
|
|
38
|
-
"name": "buttons.1",
|
|
39
|
-
"type": "button/quick_reply",
|
|
40
|
-
"content": "No {{1}}",
|
|
41
21
|
"params": [
|
|
42
22
|
{
|
|
43
23
|
"type": "text"
|
|
44
24
|
}
|
|
45
|
-
]
|
|
25
|
+
],
|
|
26
|
+
"content": "We have reserved a table for you at {{1}}. See you soon!",
|
|
27
|
+
"variables": {
|
|
28
|
+
"1": 0
|
|
29
|
+
}
|
|
46
30
|
}
|
|
47
|
-
]
|
|
48
|
-
|
|
49
|
-
{
|
|
50
|
-
"channel": {
|
|
51
|
-
"uuid": "4da11872-9299-4649-8672-78257d7b72d0",
|
|
52
|
-
"name": "WhatsApp"
|
|
53
|
-
},
|
|
54
|
-
"namespace": "",
|
|
55
|
-
"locale": "fra-FR",
|
|
56
|
-
"status": "approved",
|
|
57
|
-
"components": [
|
|
58
|
-
{
|
|
59
|
-
"name": "body",
|
|
60
|
-
"type": "body",
|
|
61
|
-
"content": "bon jour bob {{1}} from {{2}}",
|
|
62
|
-
"params": [
|
|
63
|
-
{
|
|
64
|
-
"type": "text"
|
|
65
|
-
},
|
|
66
|
-
{
|
|
67
|
-
"type": "text"
|
|
68
|
-
}
|
|
69
|
-
]
|
|
70
|
-
},
|
|
31
|
+
],
|
|
32
|
+
"variables": [
|
|
71
33
|
{
|
|
72
|
-
"
|
|
73
|
-
"type": "button/quick_reply",
|
|
74
|
-
"content": "Yes",
|
|
75
|
-
"params": []
|
|
76
|
-
},
|
|
77
|
-
{
|
|
78
|
-
"name": "buttons.1",
|
|
79
|
-
"type": "button/quick_reply",
|
|
80
|
-
"content": "No {{1}}",
|
|
81
|
-
"params": [
|
|
82
|
-
{
|
|
83
|
-
"type": "text"
|
|
84
|
-
}
|
|
85
|
-
]
|
|
34
|
+
"type": "text"
|
|
86
35
|
}
|
|
87
36
|
]
|
|
88
37
|
}
|
|
89
38
|
],
|
|
90
|
-
"created_on": "
|
|
91
|
-
"modified_on": "
|
|
39
|
+
"created_on": "2024-04-30T21:25:18.250700Z",
|
|
40
|
+
"modified_on": "2024-04-30T21:25:18.250702Z"
|
|
92
41
|
},
|
|
93
42
|
{
|
|
94
|
-
"uuid": "
|
|
95
|
-
"name": "
|
|
43
|
+
"uuid": "2b1cdee4-71b4-4c9a-805c-9bce6a2e7277",
|
|
44
|
+
"name": "Dinner Menu",
|
|
96
45
|
"translations": [
|
|
97
46
|
{
|
|
98
47
|
"channel": {
|
|
99
|
-
"uuid": "
|
|
48
|
+
"uuid": "f9f488a9-cfcd-4d52-9038-313d1e8b2da5",
|
|
100
49
|
"name": "WhatsApp"
|
|
101
50
|
},
|
|
102
51
|
"namespace": "",
|
|
@@ -106,143 +55,94 @@
|
|
|
106
55
|
{
|
|
107
56
|
"name": "body",
|
|
108
57
|
"type": "body",
|
|
109
|
-
"content": "Hi bob {{1}} from {{2}}",
|
|
110
58
|
"params": [
|
|
59
|
+
{
|
|
60
|
+
"type": "text"
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
"type": "text"
|
|
64
|
+
},
|
|
111
65
|
{
|
|
112
66
|
"type": "text"
|
|
113
67
|
},
|
|
114
68
|
{
|
|
115
69
|
"type": "text"
|
|
116
70
|
}
|
|
117
|
-
]
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
71
|
+
],
|
|
72
|
+
"content": "Hi there {{2}}! We are in the process of preparing our world class menu. So {{2}}, tell me, would you like {{1}} or {{3}}. Thanks, {{agent}}.",
|
|
73
|
+
"variables": {
|
|
74
|
+
"1": 1,
|
|
75
|
+
"2": 0,
|
|
76
|
+
"3": 2,
|
|
77
|
+
"agent": 3
|
|
78
|
+
}
|
|
124
79
|
},
|
|
125
80
|
{
|
|
126
|
-
"name": "
|
|
127
|
-
"type": "button/
|
|
128
|
-
"content": "No {{1}}",
|
|
81
|
+
"name": "button.0",
|
|
82
|
+
"type": "button/url",
|
|
129
83
|
"params": [
|
|
130
84
|
{
|
|
131
85
|
"type": "text"
|
|
132
86
|
}
|
|
133
|
-
]
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
"name": "WhatsApp"
|
|
141
|
-
},
|
|
142
|
-
"namespace": "",
|
|
143
|
-
"locale": "fra-FR",
|
|
144
|
-
"status": "pending",
|
|
145
|
-
"components": [
|
|
87
|
+
],
|
|
88
|
+
"content": "https://example.com/?wa_customer={{1}}",
|
|
89
|
+
"display": "Dish A",
|
|
90
|
+
"variables": {
|
|
91
|
+
"1": 1
|
|
92
|
+
}
|
|
93
|
+
},
|
|
146
94
|
{
|
|
147
|
-
"name": "
|
|
148
|
-
"type": "
|
|
149
|
-
"content": "bon jour bob {{1}} from {{2}}",
|
|
95
|
+
"name": "button.1",
|
|
96
|
+
"type": "button/url",
|
|
150
97
|
"params": [
|
|
151
|
-
{
|
|
152
|
-
"type": "text"
|
|
153
|
-
},
|
|
154
98
|
{
|
|
155
99
|
"type": "text"
|
|
156
100
|
}
|
|
157
|
-
]
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
"
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
"params": []
|
|
101
|
+
],
|
|
102
|
+
"content": "https://example.com/?wa_organization={{1}}",
|
|
103
|
+
"display": "Dish B",
|
|
104
|
+
"variables": {
|
|
105
|
+
"1": 2
|
|
106
|
+
}
|
|
164
107
|
},
|
|
165
108
|
{
|
|
166
|
-
"name": "
|
|
109
|
+
"name": "button.2",
|
|
167
110
|
"type": "button/quick_reply",
|
|
168
|
-
"content": "No {{1}}",
|
|
169
111
|
"params": [
|
|
170
112
|
{
|
|
171
113
|
"type": "text"
|
|
172
114
|
}
|
|
173
|
-
]
|
|
115
|
+
],
|
|
116
|
+
"content": "Not Hungry"
|
|
174
117
|
}
|
|
175
|
-
]
|
|
176
|
-
|
|
177
|
-
],
|
|
178
|
-
"created_on": "2023-09-08T22:38:22.703997Z",
|
|
179
|
-
"modified_on": "2023-09-08T22:38:22.707271Z"
|
|
180
|
-
},
|
|
181
|
-
{
|
|
182
|
-
"uuid": "580b124f-32cb-4003-b9e5-9eb783e29101",
|
|
183
|
-
"name": "Car Warranty",
|
|
184
|
-
"translations": [
|
|
185
|
-
{
|
|
186
|
-
"channel": {
|
|
187
|
-
"uuid": "4da11872-9299-4649-8672-78257d7b72d0",
|
|
188
|
-
"name": "WhatsApp"
|
|
189
|
-
},
|
|
190
|
-
"namespace": "",
|
|
191
|
-
"locale": "eng-US",
|
|
192
|
-
"status": "approved",
|
|
193
|
-
"components": [
|
|
118
|
+
],
|
|
119
|
+
"variables": [
|
|
194
120
|
{
|
|
195
|
-
"
|
|
196
|
-
"type": "body",
|
|
197
|
-
"content": "Hi there, we are trying to reach {{1}} about their car warranty. It turns out you only have until {{2}} to decide whether to extend it further. Please contact us at {{3}} at your earliest convenience to discuss your options. Are you still interested?",
|
|
198
|
-
"params": [
|
|
199
|
-
{
|
|
200
|
-
"type": "text"
|
|
201
|
-
},
|
|
202
|
-
{
|
|
203
|
-
"type": "text"
|
|
204
|
-
},
|
|
205
|
-
{
|
|
206
|
-
"type": "text"
|
|
207
|
-
}
|
|
208
|
-
]
|
|
121
|
+
"type": "text"
|
|
209
122
|
},
|
|
210
123
|
{
|
|
211
|
-
"
|
|
212
|
-
"type": "button/quick_reply",
|
|
213
|
-
"content": "Yes",
|
|
214
|
-
"params": []
|
|
124
|
+
"type": "text"
|
|
215
125
|
},
|
|
216
126
|
{
|
|
217
|
-
"
|
|
218
|
-
"type": "button/quick_reply",
|
|
219
|
-
"content": "No"
|
|
127
|
+
"type": "text"
|
|
220
128
|
},
|
|
221
129
|
{
|
|
222
|
-
"
|
|
223
|
-
"type": "button/quick_reply",
|
|
224
|
-
"content": "Wait until {{1}}",
|
|
225
|
-
"params": [
|
|
226
|
-
{
|
|
227
|
-
"type": "text"
|
|
228
|
-
}
|
|
229
|
-
]
|
|
130
|
+
"type": "text"
|
|
230
131
|
}
|
|
231
132
|
]
|
|
232
133
|
},
|
|
233
134
|
{
|
|
234
135
|
"channel": {
|
|
235
|
-
"uuid": "
|
|
136
|
+
"uuid": "f9f488a9-cfcd-4d52-9038-313d1e8b2da5",
|
|
236
137
|
"name": "WhatsApp"
|
|
237
138
|
},
|
|
238
139
|
"namespace": "",
|
|
239
140
|
"locale": "fra-FR",
|
|
240
|
-
"status": "
|
|
141
|
+
"status": "approved",
|
|
241
142
|
"components": [
|
|
242
143
|
{
|
|
243
144
|
"name": "body",
|
|
244
145
|
"type": "body",
|
|
245
|
-
"content": "Bonjour, nous essayons d'atteindre {{1}} à propos de leur garantie automobile. Il s'avère que tu n'as que jusqu'à {{2}} pour décider s'il convient de le prolonger davantage. Veuillez nous contacter au {{3}} dès que possible pour discuter de vos options. Êtes vous toujours intéressé?",
|
|
246
146
|
"params": [
|
|
247
147
|
{
|
|
248
148
|
"type": "text"
|
|
@@ -253,34 +153,75 @@
|
|
|
253
153
|
{
|
|
254
154
|
"type": "text"
|
|
255
155
|
}
|
|
256
|
-
]
|
|
156
|
+
],
|
|
157
|
+
"content": "Bonjour {{1}}! Nous sommes en train de préparer notre menu de classe mondiale. So {{1}}, souhaitez-vous {{2}} ou {{3}}. Merci, {{agent}}.",
|
|
158
|
+
"variables": {
|
|
159
|
+
"1": 0,
|
|
160
|
+
"2": 1,
|
|
161
|
+
"3": 2,
|
|
162
|
+
"agent": 3
|
|
163
|
+
}
|
|
257
164
|
},
|
|
258
165
|
{
|
|
259
|
-
"name": "
|
|
260
|
-
"type": "button/
|
|
261
|
-
"
|
|
262
|
-
|
|
166
|
+
"name": "button.0",
|
|
167
|
+
"type": "button/url",
|
|
168
|
+
"params": [
|
|
169
|
+
{
|
|
170
|
+
"type": "text"
|
|
171
|
+
}
|
|
172
|
+
],
|
|
173
|
+
"content": "https://example.com/?wa_customer={{1}}",
|
|
174
|
+
"display": "Plat A",
|
|
175
|
+
"variables": {
|
|
176
|
+
"1": 1
|
|
177
|
+
}
|
|
263
178
|
},
|
|
264
179
|
{
|
|
265
|
-
"name": "
|
|
266
|
-
"type": "button/
|
|
267
|
-
"
|
|
180
|
+
"name": "button.1",
|
|
181
|
+
"type": "button/url",
|
|
182
|
+
"params": [
|
|
183
|
+
{
|
|
184
|
+
"type": "text"
|
|
185
|
+
}
|
|
186
|
+
],
|
|
187
|
+
"content": "https://example.com/?wa_organization={{1}}",
|
|
188
|
+
"display": "Plat B",
|
|
189
|
+
"variables": {
|
|
190
|
+
"1": 2
|
|
191
|
+
}
|
|
268
192
|
},
|
|
269
193
|
{
|
|
270
|
-
"name": "
|
|
194
|
+
"name": "button.2",
|
|
271
195
|
"type": "button/quick_reply",
|
|
272
|
-
"content": "Attendre jusqu'à {{1}}",
|
|
273
196
|
"params": [
|
|
274
197
|
{
|
|
275
198
|
"type": "text"
|
|
276
199
|
}
|
|
277
|
-
]
|
|
200
|
+
],
|
|
201
|
+
"content": "Pas Faim",
|
|
202
|
+
"variables": {
|
|
203
|
+
"1": 4
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
],
|
|
207
|
+
"variables": [
|
|
208
|
+
{
|
|
209
|
+
"type": "text"
|
|
210
|
+
},
|
|
211
|
+
{
|
|
212
|
+
"type": "text"
|
|
213
|
+
},
|
|
214
|
+
{
|
|
215
|
+
"type": "text"
|
|
216
|
+
},
|
|
217
|
+
{
|
|
218
|
+
"type": "text"
|
|
278
219
|
}
|
|
279
220
|
]
|
|
280
221
|
}
|
|
281
222
|
],
|
|
282
|
-
"created_on": "
|
|
283
|
-
"modified_on": "
|
|
223
|
+
"created_on": "2024-04-30T21:25:18.245260Z",
|
|
224
|
+
"modified_on": "2024-04-30T21:25:18.248575Z"
|
|
284
225
|
}
|
|
285
226
|
]
|
|
286
227
|
}
|
|
@@ -17,13 +17,13 @@ describe('TemplateEditor', () => {
|
|
|
17
17
|
const templateEditor = await createTemplateEditor(html`
|
|
18
18
|
<temba-template-editor
|
|
19
19
|
url="/static/api/templates.json"
|
|
20
|
-
template="
|
|
20
|
+
template="2b1cdee4-71b4-4c9a-805c-9bce6a2e7277"
|
|
21
21
|
lang="eng"
|
|
22
22
|
>
|
|
23
23
|
</temba-template-editor>
|
|
24
24
|
`);
|
|
25
25
|
const clip = getClip(templateEditor);
|
|
26
|
-
clip.height =
|
|
26
|
+
clip.height = 500;
|
|
27
27
|
clip.bottom = clip.top + clip.height;
|
|
28
28
|
await assertScreenshot('templates/default', clip);
|
|
29
29
|
});
|
|
@@ -32,7 +32,7 @@ describe('TemplateEditor', () => {
|
|
|
32
32
|
const templateEditor = await createTemplateEditor(html`
|
|
33
33
|
<temba-template-editor
|
|
34
34
|
url="/static/api/templates.json"
|
|
35
|
-
template="
|
|
35
|
+
template="2b1cdee4-71b4-4c9a-805c-9bce6a2e7277"
|
|
36
36
|
lang="eng"
|
|
37
37
|
>
|
|
38
38
|
</temba-template-editor>
|
|
@@ -41,7 +41,7 @@ describe('TemplateEditor', () => {
|
|
|
41
41
|
templateEditor.lang = 'fra';
|
|
42
42
|
|
|
43
43
|
const clip = getClip(templateEditor);
|
|
44
|
-
clip.height =
|
|
44
|
+
clip.height = 500;
|
|
45
45
|
clip.bottom = clip.top + clip.height;
|
|
46
46
|
|
|
47
47
|
await assertScreenshot('templates/french', clip);
|
|
@@ -51,7 +51,7 @@ describe('TemplateEditor', () => {
|
|
|
51
51
|
const templateEditor = await createTemplateEditor(html`
|
|
52
52
|
<temba-template-editor
|
|
53
53
|
url="/static/api/templates.json"
|
|
54
|
-
template="
|
|
54
|
+
template="2b1cdee4-71b4-4c9a-805c-9bce6a2e7277"
|
|
55
55
|
lang="spa"
|
|
56
56
|
>
|
|
57
57
|
</temba-template-editor>
|