@nyaruka/temba-components 0.111.7 → 0.113.0

package/out-tsc/test/temba-contact-chat.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"temba-contact-chat.test.js","sourceRoot":"","sources":["../../test/temba-contact-chat.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { useFakeTimers } from 'sinon';\nimport { Compose } from '../src/compose/Compose';\nimport { ContactChat } from '../src/contacts/ContactChat';\nimport { Attachment, CustomEventType } from '../src/interfaces';\nimport {\n  assertScreenshot,\n  clearMockPosts,\n  getClip,\n  getComponent,\n  loadStore,\n  mockGET,\n  mockNow,\n  mockPOST\n} from '../test/utils.test';\nimport {\n  getValidAttachments,\n  getValidText,\n  updateComponent\n} from './temba-compose.test';\n\nimport { expect, oneEvent } from '@open-wc/testing';\n\nlet clock: any;\nmockNow('2021-03-31T00:31:00.000-00:00');\n\nconst TAG = 'temba-contact-chat';\nconst getContactChat = async (attrs: any = {}) => {\n  attrs['endpoint'] = '/test-assets/contacts/';\n  // add some sizes and styles to force our chat history to scroll\n  const chat = (await getComponent(\n    TAG,\n    attrs,\n    '',\n    500,\n    500,\n    'display:flex;flex-direction:column;flex-grow:1;min-height:0;'\n  )) as ContactChat;\n\n  // TODO: this should be waiting for an event instead\n  await waitFor(100);\n  await clock.tick(0);\n  return chat;\n};\n\nconst getResponseSuccessFiles = (attachments: Attachment[]) => {\n  const response_attachments = attachments.map((attachment) => {\n    return { content_type: attachment.content_type, url: attachment.url };\n  });\n  return response_attachments;\n};\n\ndescribe('temba-contact-chat', () => {\n  // map requests for contact history to our static files\n  // we'll just us the same historylist for everybody for now\n  beforeEach(() => {\n    clearMockPosts();\n    mockGET(\n      /\\/contact\\/history\\/contact-.*/,\n      '/test-assets/contacts/history.json'\n    );\n    clock = useFakeTimers();\n  });\n\n  afterEach(function () {\n    clock.restore();\n  });\n\n  it('show history and show chatbox if contact is active', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n\n    await assertScreenshot('contacts/chat-for-active-contact', getClip(chat));\n  });\n\n  it('show history and hide chatbox if contact is archived', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-barack-archived'\n    });\n\n    await assertScreenshot('contacts/chat-for-archived-contact', getClip(chat));\n  });\n\n  it('show history and hide chatbox if contact is blocked', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-michelle-blocked'\n    });\n\n    await assertScreenshot('contacts/chat-for-blocked-contact', getClip(chat));\n  });\n\n  it('show history and hide chatbox if contact is stopped', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-tim-stopped'\n    });\n\n    await assertScreenshot('contacts/chat-for-stopped-contact', getClip(chat));\n  });\n\n  it('sends text without attachments', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    const text = getValidText();\n    await updateComponent(compose, text);\n\n    const response_body = {\n      contact: { uuid: 'contact-dave-active', name: 'Dave Matthews' },\n      text: text,\n      attachments: []\n    };\n    mockPOST(/api\\/v2\\/messages\\.json/, response_body);\n\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', text, true, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot('contacts/chat-sends-text-only', getClip(chat));\n  });\n\n  it('sends attachments without text', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    const attachments = getValidAttachments();\n    await updateComponent(compose, null, attachments);\n    const response_attachments = getResponseSuccessFiles(attachments);\n    const response_body = {\n      contact: { uuid: 'contact-dave-active', name: 'Dave Matthews' },\n      text: '',\n      attachments: response_attachments\n    };\n    const response_headers = {};\n    const response_status = '200';\n    mockPOST(\n      /api\\/v2\\/messages\\.json/,\n      response_body,\n      response_headers,\n      response_status\n    );\n\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', '', false, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot(\n      'contacts/chat-sends-attachments-only',\n      getClip(chat)\n    );\n  });\n\n  it('sends text with attachments', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    const text = getValidText();\n    const attachments = getValidAttachments();\n    await updateComponent(compose, text, attachments);\n    const response_attachments = getResponseSuccessFiles(attachments);\n    const response_body = {\n      contact: { uuid: 'contact-dave-active', name: 'Dave Matthews' },\n      text: text,\n      attachments: response_attachments\n    };\n    mockPOST(/api\\/v2\\/messages\\.json/, response_body);\n\n    // press enter\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', '', false, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot(\n      'contacts/chat-sends-text-and-attachments',\n      getClip(chat)\n    );\n  });\n\n  it('shows failure message with retry', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    await updateComponent(compose, getValidText(), getValidAttachments());\n\n    const response_body = {};\n    const response_headers = {};\n    const response_status = '500';\n    mockPOST(\n      /api\\/v2\\/messages\\.json/,\n      response_body,\n      response_headers,\n      response_status\n    );\n\n    // press\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', '', false, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot('contacts/chat-failure', getClip(chat));\n  });\n});\n"]}
+{"version":3,"file":"temba-contact-chat.test.js","sourceRoot":"","sources":["../../test/temba-contact-chat.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { useFakeTimers } from 'sinon';\nimport { Compose } from '../src/compose/Compose';\nimport { ContactChat } from '../src/contacts/ContactChat';\nimport { Attachment, CustomEventType } from '../src/interfaces';\nimport {\n  assertScreenshot,\n  clearMockPosts,\n  getClip,\n  getComponent,\n  loadStore,\n  mockAPI,\n  mockGET,\n  mockNow,\n  mockPOST\n} from '../test/utils.test';\nimport {\n  getValidAttachments,\n  getValidText,\n  updateComponent\n} from './temba-compose.test';\n\nimport { expect, oneEvent } from '@open-wc/testing';\n\nlet clock: any;\nmockNow('2021-03-31T00:31:00.000-00:00');\n\nconst TAG = 'temba-contact-chat';\nconst getContactChat = async (attrs: any = {}) => {\n  attrs['endpoint'] = '/test-assets/contacts/';\n  // add some sizes and styles to force our chat history to scroll\n  const chat = (await getComponent(\n    TAG,\n    attrs,\n    '',\n    500,\n    500,\n    'display:flex;flex-direction:column;flex-grow:1;min-height:0;'\n  )) as ContactChat;\n\n  // TODO: this should be waiting for an event instead\n  await waitFor(100);\n  await clock.tick(0);\n  return chat;\n};\n\nconst getResponseSuccessFiles = (attachments: Attachment[]) => {\n  const response_attachments = attachments.map((attachment) => {\n    return { content_type: attachment.content_type, url: attachment.url };\n  });\n  return response_attachments;\n};\n\ndescribe('temba-contact-chat', () => {\n  // map requests for contact history to our static files\n  // we'll just us the same historylist for everybody for now\n  beforeEach(() => {\n    clearMockPosts();\n    mockGET(\n      /\\/contact\\/history\\/contact-.*/,\n      '/test-assets/contacts/history.json'\n    );\n\n    mockAPI();\n    clock = useFakeTimers();\n  });\n\n  afterEach(function () {\n    clock.restore();\n  });\n\n  it('show history and show chatbox if contact is active', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n\n    await assertScreenshot('contacts/chat-for-active-contact', getClip(chat));\n  });\n\n  it('show history and hide chatbox if contact is archived', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-barack-archived'\n    });\n\n    await assertScreenshot('contacts/chat-for-archived-contact', getClip(chat));\n  });\n\n  it('show history and hide chatbox if contact is blocked', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-michelle-blocked'\n    });\n\n    await assertScreenshot('contacts/chat-for-blocked-contact', getClip(chat));\n  });\n\n  it('show history and hide chatbox if contact is stopped', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-tim-stopped'\n    });\n\n    await assertScreenshot('contacts/chat-for-stopped-contact', getClip(chat));\n  });\n\n  it('sends text without attachments', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    const text = getValidText();\n    await updateComponent(compose, text);\n\n    const response_body = {\n      contact: { uuid: 'contact-dave-active', name: 'Dave Matthews' },\n      text: text,\n      attachments: []\n    };\n    mockPOST(/api\\/v2\\/messages\\.json/, response_body);\n\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', text, true, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot('contacts/chat-sends-text-only', getClip(chat));\n  });\n\n  it('sends attachments without text', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    const attachments = getValidAttachments();\n    await updateComponent(compose, null, attachments);\n    const response_attachments = getResponseSuccessFiles(attachments);\n    const response_body = {\n      contact: { uuid: 'contact-dave-active', name: 'Dave Matthews' },\n      text: '',\n      attachments: response_attachments\n    };\n    const response_headers = {};\n    const response_status = '200';\n    mockPOST(\n      /api\\/v2\\/messages\\.json/,\n      response_body,\n      response_headers,\n      response_status\n    );\n\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', '', false, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot(\n      'contacts/chat-sends-attachments-only',\n      getClip(chat)\n    );\n  });\n\n  it('sends text with attachments', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    const text = getValidText();\n    const attachments = getValidAttachments();\n    await updateComponent(compose, text, attachments);\n    const response_attachments = getResponseSuccessFiles(attachments);\n    const response_body = {\n      contact: { uuid: 'contact-dave-active', name: 'Dave Matthews' },\n      text: text,\n      attachments: response_attachments\n    };\n    mockPOST(/api\\/v2\\/messages\\.json/, response_body);\n\n    // press enter\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', '', false, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot(\n      'contacts/chat-sends-text-and-attachments',\n      getClip(chat)\n    );\n  });\n\n  it('shows failure message with retry', async () => {\n    // we are a StoreElement, so load a store first\n    await loadStore();\n    const chat: ContactChat = await getContactChat({\n      contact: 'contact-dave-active'\n    });\n    const compose = chat.shadowRoot.querySelector('temba-compose') as Compose;\n    await updateComponent(compose, getValidText(), getValidAttachments());\n\n    const response_body = {};\n    const response_headers = {};\n    const response_status = '500';\n    mockPOST(\n      /api\\/v2\\/messages\\.json/,\n      response_body,\n      response_headers,\n      response_status\n    );\n\n    // press\n    const listener = oneEvent(compose, CustomEventType.Submitted, false);\n    await typeInto('temba-contact-chat:temba-compose', '', false, true);\n    expect(await listener).to.exist;\n\n    await assertScreenshot('contacts/chat-failure', getClip(chat));\n  });\n});\n"]}

package/out-tsc/test/temba-contact-tickets.test.js

@@ -1,6 +1,6 @@
 import { assert, waitUntil } from '@open-wc/testing';
 import { ContactTickets } from '../src/contacts/ContactTickets';
-import { assertScreenshot, getClip, getComponent, loadStore, mockGET, mockNow } from './utils.test';
+import { assertScreenshot, getClip, getComponent, loadStore, mockAPI, mockNow } from './utils.test';
 const TAG = 'temba-contact-tickets';
 const getContactTickets = async (attrs = {}) => {
     const contactTickets = (await getComponent(TAG, attrs, '', 400));
@@ -11,7 +11,7 @@ const getContactTickets = async (attrs = {}) => {
 mockNow('2023-04-07T00:00:00.000-00:00');
 describe('temba-contact-tickets', () => {
     beforeEach(() => {
-        mockGET(/\/api\/v2\/tickets.json\?contact=24d64810-3315-4ff5-be85-48e3fe055bf9/, '/test-assets/contacts/contact-tickets.json');
+        mockAPI();
         loadStore();
     });
     it('renders default', async () => {

package/out-tsc/test/temba-contact-tickets.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"temba-contact-tickets.test.js","sourceRoot":"","sources":["../../test/temba-contact-tickets.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EACL,gBAAgB,EAChB,OAAO,EACP,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACR,MAAM,cAAc,CAAC;AAEtB,MAAM,GAAG,GAAG,uBAAuB,CAAC;AACpC,MAAM,iBAAiB,GAAG,KAAK,EAAE,QAAa,EAAE,EAAE,EAAE;IAClD,MAAM,cAAc,GAAG,CAAC,MAAM,YAAY,CACxC,GAAG,EACH,KAAK,EACL,EAAE,EACF,GAAG,CACJ,CAAmB,CAAC;IACrB,+BAA+B;IAC/B,MAAM,SAAS,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;IAC7C,OAAO,cAAc,CAAC;AACxB,CAAC,CAAC;AAEF,OAAO,CAAC,+BAA+B,CAAC,CAAC;AACzC,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;IACrC,UAAU,CAAC,GAAG,EAAE;QACd,OAAO,CACL,uEAAuE,EACvE,4CAA4C,CAC7C,CAAC;QACF,SAAS,EAAE,CAAC;IACd,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iBAAiB,EAAE,KAAK,IAAI,EAAE;QAC/B,MAAM,OAAO,GAAmB,MAAM,iBAAiB,CAAC;YACtD,OAAO,EAAE,sCAAsC;YAC/C,KAAK,EAAE,oBAAoB;SAC5B,CAAC,CAAC;QACH,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAC3C,MAAM,gBAAgB,CAAC,kBAAkB,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;QACvC,MAAM,OAAO,GAAmB,MAAM,iBAAiB,CAAC;YACtD,OAAO,EAAE,sCAAsC;YAC/C,KAAK,EAAE,oBAAoB;SAC5B,CAAC,CAAC;QAEH,8BAA8B;QAC7B,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAoB,CAAC,KAAK,EAAE,CAAC;QAC3E,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAC3C,MAAM,gBAAgB,CAAC,6BAA6B,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC1E,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { assert, waitUntil } from '@open-wc/testing';\nimport { ContactTickets } from '../src/contacts/ContactTickets';\nimport {\n  assertScreenshot,\n  getClip,\n  getComponent,\n  loadStore,\n  mockGET,\n  mockNow\n} from './utils.test';\n\nconst TAG = 'temba-contact-tickets';\nconst getContactTickets = async (attrs: any = {}) => {\n  const contactTickets = (await getComponent(\n    TAG,\n    attrs,\n    '',\n    400\n  )) as ContactTickets;\n  // wait for our contact to load\n  await waitUntil(() => !!contactTickets.data);\n  return contactTickets;\n};\n\nmockNow('2023-04-07T00:00:00.000-00:00');\ndescribe('temba-contact-tickets', () => {\n  beforeEach(() => {\n    mockGET(\n      /\\/api\\/v2\\/tickets.json\\?contact=24d64810-3315-4ff5-be85-48e3fe055bf9/,\n      '/test-assets/contacts/contact-tickets.json'\n    );\n    loadStore();\n  });\n\n  it('renders default', async () => {\n    const tickets: ContactTickets = await getContactTickets({\n      contact: '24d64810-3315-4ff5-be85-48e3fe055bf9',\n      agent: 'admin1@nyaruka.com'\n    });\n    assert.instanceOf(tickets, ContactTickets);\n    await assertScreenshot('contacts/tickets', getClip(tickets));\n  });\n\n  it('shows assignment picker', async () => {\n    const tickets: ContactTickets = await getContactTickets({\n      contact: '24d64810-3315-4ff5-be85-48e3fe055bf9',\n      agent: 'admin1@nyaruka.com'\n    });\n\n    // click on the avatar element\n    (tickets.shadowRoot.querySelector('temba-user') as HTMLDivElement).click();\n    assert.instanceOf(tickets, ContactTickets);\n    await assertScreenshot('contacts/tickets-assignment', getClip(tickets));\n  });\n});\n"]}
+{"version":3,"file":"temba-contact-tickets.test.js","sourceRoot":"","sources":["../../test/temba-contact-tickets.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EACL,gBAAgB,EAChB,OAAO,EACP,YAAY,EACZ,SAAS,EACT,OAAO,EACP,OAAO,EACR,MAAM,cAAc,CAAC;AAEtB,MAAM,GAAG,GAAG,uBAAuB,CAAC;AACpC,MAAM,iBAAiB,GAAG,KAAK,EAAE,QAAa,EAAE,EAAE,EAAE;IAClD,MAAM,cAAc,GAAG,CAAC,MAAM,YAAY,CACxC,GAAG,EACH,KAAK,EACL,EAAE,EACF,GAAG,CACJ,CAAmB,CAAC;IACrB,+BAA+B;IAC/B,MAAM,SAAS,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;IAC7C,OAAO,cAAc,CAAC;AACxB,CAAC,CAAC;AAEF,OAAO,CAAC,+BAA+B,CAAC,CAAC;AACzC,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;IACrC,UAAU,CAAC,GAAG,EAAE;QACd,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,CAAC;IACd,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iBAAiB,EAAE,KAAK,IAAI,EAAE;QAC/B,MAAM,OAAO,GAAmB,MAAM,iBAAiB,CAAC;YACtD,OAAO,EAAE,sCAAsC;YAC/C,KAAK,EAAE,oBAAoB;SAC5B,CAAC,CAAC;QACH,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAC3C,MAAM,gBAAgB,CAAC,kBAAkB,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;QACvC,MAAM,OAAO,GAAmB,MAAM,iBAAiB,CAAC;YACtD,OAAO,EAAE,sCAAsC;YAC/C,KAAK,EAAE,oBAAoB;SAC5B,CAAC,CAAC;QAEH,8BAA8B;QAC7B,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,YAAY,CAAoB,CAAC,KAAK,EAAE,CAAC;QAC3E,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;QAC3C,MAAM,gBAAgB,CAAC,6BAA6B,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC1E,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { assert, waitUntil } from '@open-wc/testing';\nimport { ContactTickets } from '../src/contacts/ContactTickets';\nimport {\n  assertScreenshot,\n  getClip,\n  getComponent,\n  loadStore,\n  mockAPI,\n  mockNow\n} from './utils.test';\n\nconst TAG = 'temba-contact-tickets';\nconst getContactTickets = async (attrs: any = {}) => {\n  const contactTickets = (await getComponent(\n    TAG,\n    attrs,\n    '',\n    400\n  )) as ContactTickets;\n  // wait for our contact to load\n  await waitUntil(() => !!contactTickets.data);\n  return contactTickets;\n};\n\nmockNow('2023-04-07T00:00:00.000-00:00');\ndescribe('temba-contact-tickets', () => {\n  beforeEach(() => {\n    mockAPI();\n    loadStore();\n  });\n\n  it('renders default', async () => {\n    const tickets: ContactTickets = await getContactTickets({\n      contact: '24d64810-3315-4ff5-be85-48e3fe055bf9',\n      agent: 'admin1@nyaruka.com'\n    });\n    assert.instanceOf(tickets, ContactTickets);\n    await assertScreenshot('contacts/tickets', getClip(tickets));\n  });\n\n  it('shows assignment picker', async () => {\n    const tickets: ContactTickets = await getContactTickets({\n      contact: '24d64810-3315-4ff5-be85-48e3fe055bf9',\n      agent: 'admin1@nyaruka.com'\n    });\n\n    // click on the avatar element\n    (tickets.shadowRoot.querySelector('temba-user') as HTMLDivElement).click();\n    assert.instanceOf(tickets, ContactTickets);\n    await assertScreenshot('contacts/tickets-assignment', getClip(tickets));\n  });\n});\n"]}

package/out-tsc/test/utils.test.js

@@ -80,6 +80,31 @@ before(async () => {
 after(() => {
     window.fetch.restore();
 });
+const mockMapping = {
+    '/test-assets/api/users/admin1.json': [
+        /\/api\/v2\/users.json\?email=admin1@nyaruka.com/
+    ],
+    '/test-assets/api/users/editor1.json': [
+        /\/api\/v2\/users.json\?email=editor1@nyaruka.com/
+    ],
+    '/test-assets/api/users/agent1.json': [
+        /\/api\/v2\/users.json\?email=agent1@nyaruka.com/
+    ],
+    '/test-assets/api/users/viewer1.json': [
+        /\/api\/v2\/users.json\?email=viewer1@nyaruka.com/
+    ],
+    '/test-assets/contacts/contact-tickets.json': [
+        /\/api\/v2\/tickets.json\?contact=24d64810-3315-4ff5-be85-48e3fe055bf9/
+    ]
+};
+export const mockAPI = () => {
+    for (const key in mockMapping) {
+        const urls = mockMapping[key];
+        for (const url of urls) {
+            mockGET(url, key);
+        }
+    }
+};
 export const mockGET = (endpoint, body, headers = {}, status = '200') => {
     gets.push({ endpoint, body, headers, status });
 };

package/out-tsc/test/utils.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.test.js","sourceRoot":"","sources":["../../test/utils.test.ts"],"names":[],"mappings":"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","sourcesContent":["import '../temba-modules';\nimport { DateTime } from 'luxon';\ninterface Clip {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\nimport { expect, fixture, html, assert, waitUntil } from '@open-wc/testing';\nimport MouseHelper from './MouseHelper';\nimport { Store } from '../src/store/Store';\nimport { replace, stub } from 'sinon';\n\nexport interface CodeMock {\n  endpoint: RegExp;\n  body: string;\n  headers: any;\n  status: string;\n}\n\nconst gets: CodeMock[] = [];\nlet posts: CodeMock[] = [];\nlet normalFetch;\n\nexport const showMouse = async () => {\n  const mouse = await fixture(html`<mouse-helper />`);\n  assert.instanceOf(mouse, MouseHelper);\n};\n\nexport const getAttributes = (attrs: any = {}) => {\n  return `${Object.keys(attrs)\n    .map((name: string) => {\n      if (typeof attrs[name] === 'boolean' && attrs[name]) {\n        return name;\n      }\n      return `${name}='${attrs[name]}'`;\n    })\n    .join(' ')}`;\n};\n\nexport const getComponent = async (\n  tag,\n  attrs: any = {},\n  slot = '',\n  width = 250,\n  height = 0,\n  style = ''\n) => {\n  const spec = `<${tag} ${getAttributes(attrs)}>${slot}</${tag}>`;\n  const parentNode = document.createElement('div');\n  const styleAttribute = `\n    ${width > 0 ? `width:${width}px;` : ``} \n    ${height > 0 ? `height:${height}px;` : ``}\n    ${style ? style : ``}\n  `;\n  parentNode.setAttribute('style', styleAttribute);\n  return await fixture(spec, { parentNode });\n};\n\nconst createResponse = (mocked) => {\n  const mockResponse = new window.Response(mocked.body, {\n    status: mocked.status,\n    headers: {\n      'Content-type': 'text/html',\n      ...mocked.headers\n    }\n  });\n\n  return Promise.resolve(mockResponse);\n};\n\nconst createJSONResponse = (mocked) => {\n  const mockResponse = new window.Response(JSON.stringify(mocked.body), {\n    status: mocked.status,\n    headers: {\n      'Content-type': 'application/json',\n      ...mocked.headers\n    }\n  });\n\n  return Promise.resolve(mockResponse);\n};\n\nconst getResponse = (endpoint: string, options) => {\n  // check if our path has been mocked in code\n  const mocks = options.method === 'GET' ? gets : posts;\n  const codeMock = mocks.find((mock) => mock.endpoint.test(endpoint));\n\n  if (codeMock) {\n    if (typeof codeMock.body === 'string') {\n      // see if we are being mocked to a file\n      if (codeMock.body.startsWith('/')) {\n        endpoint = codeMock.body;\n      } else {\n        return createResponse(codeMock);\n      }\n    } else {\n      return createJSONResponse(codeMock);\n    }\n  }\n\n  // otherwise fetch over http\n  return normalFetch(endpoint, options);\n};\n\nbefore(async () => {\n  normalFetch = window.fetch;\n  stub(window, 'fetch').callsFake(getResponse);\n  await setViewport({ width: 1024, height: 768, deviceScaleFactor: 2 });\n});\n\nafter(() => {\n  (window.fetch as any).restore();\n});\n\nexport const mockGET = (\n  endpoint: RegExp,\n  body: any,\n  headers: any = {},\n  status = '200'\n) => {\n  gets.push({ endpoint, body, headers, status });\n};\n\nexport const mockPOST = (\n  endpoint: RegExp,\n  body: any,\n  headers: any = {},\n  status = '200'\n) => {\n  posts.push({ endpoint, body, headers, status });\n};\n\nexport const clearMockPosts = () => {\n  posts = [];\n};\n\nexport const checkTimers = (clock: any) => {\n  expect(!!clock.timers).to.equal(true, 'Expected timers not found');\n  expect(\n    Object.keys(clock.timers).length,\n    `Timers still to be run ${JSON.stringify(clock.timers)}`\n  ).to.equal(0);\n};\n\nexport const delay = (millis: number) => {\n  return new Promise(function (resolve) {\n    window.setTimeout(resolve, millis);\n  });\n};\n\nexport const assertScreenshot = async (\n  filename: string,\n  clip: Clip,\n  waitFor?: { clock?: any; predicate?: () => boolean }\n) => {\n  if (waitFor) {\n    if (waitFor.clock) {\n      waitFor.clock.restore();\n    }\n    await waitUntil(waitFor.predicate);\n  }\n\n  const threshold = 0.1;\n  const exclude: Clip[] = [];\n\n  try {\n    await (window as any).matchPageSnapshot(\n      `${filename}.png`,\n      clip,\n      exclude,\n      threshold\n    );\n  } catch (error) {\n    if (error.message) {\n      throw new Error(\n        `${error.message} ${\n          error.expected\n            ? `Expected ${error.expected} but got ${error.actual}`\n            : ''\n        } ${error.files ? `\\n${error.files.join('\\n')}` : ''}`\n      );\n    }\n    throw new Error(error);\n  }\n};\n\nexport const getClip = (ele: HTMLElement) => {\n  let clip: any = ele.getBoundingClientRect();\n  if (!clip.width || !clip.height) {\n    clip = ele.shadowRoot.firstElementChild.getBoundingClientRect();\n  }\n\n  const padding = 10;\n  const width = clip.width + padding * 2;\n  const height = clip.height + padding * 2;\n  const y = clip.y - padding;\n  const x = clip.x - padding;\n\n  const newClip = {\n    x,\n    y,\n    width,\n    height,\n    bottom: y + height,\n    right: x + width,\n    top: y,\n    left: x\n  };\n\n  return newClip;\n};\n\nexport const getHTMLAttrs = (attrs: any = {}) => {\n  return Object.keys(attrs)\n    .map((name: string) => `${name}='${attrs[name]}'`)\n    .join(' ');\n};\n\nexport const getHTML = (tag: string, attrs: any = {}) => {\n  return `<${tag} ${getHTMLAttrs(attrs)}></${tag}>`;\n};\n\nexport const loadStore = async () => {\n  const store: Store = await fixture(\n    `<temba-store \n      completion='/test-assets/store/editor.json'\n      groups='/test-assets/store/groups.json'\n      languages='/test-assets/store/languages.json'\n      fields='/test-assets/store/fields.json'\n      users='/test-assets/store/users.json'\n    />`\n  );\n  await store.initialHttpComplete;\n  await store.initialHttpComplete;\n\n  return store;\n};\n\nexport const mockNow = (isodate: string) => {\n  const now = DateTime.fromISO(isodate);\n  // mock the current time\n  replace(DateTime, 'now', () => {\n    return now;\n  });\n};\n"]}
+{"version":3,"file":"utils.test.js","sourceRoot":"","sources":["../../test/utils.test.ts"],"names":[],"mappings":"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","sourcesContent":["import '../temba-modules';\nimport { DateTime } from 'luxon';\ninterface Clip {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\nimport { expect, fixture, html, assert, waitUntil } from '@open-wc/testing';\nimport MouseHelper from './MouseHelper';\nimport { Store } from '../src/store/Store';\nimport { replace, stub } from 'sinon';\n\nexport interface CodeMock {\n  endpoint: RegExp;\n  body: string;\n  headers: any;\n  status: string;\n}\n\nconst gets: CodeMock[] = [];\nlet posts: CodeMock[] = [];\nlet normalFetch;\n\nexport const showMouse = async () => {\n  const mouse = await fixture(html`<mouse-helper />`);\n  assert.instanceOf(mouse, MouseHelper);\n};\n\nexport const getAttributes = (attrs: any = {}) => {\n  return `${Object.keys(attrs)\n    .map((name: string) => {\n      if (typeof attrs[name] === 'boolean' && attrs[name]) {\n        return name;\n      }\n      return `${name}='${attrs[name]}'`;\n    })\n    .join(' ')}`;\n};\n\nexport const getComponent = async (\n  tag,\n  attrs: any = {},\n  slot = '',\n  width = 250,\n  height = 0,\n  style = ''\n) => {\n  const spec = `<${tag} ${getAttributes(attrs)}>${slot}</${tag}>`;\n  const parentNode = document.createElement('div');\n  const styleAttribute = `\n    ${width > 0 ? `width:${width}px;` : ``} \n    ${height > 0 ? `height:${height}px;` : ``}\n    ${style ? style : ``}\n  `;\n  parentNode.setAttribute('style', styleAttribute);\n  return await fixture(spec, { parentNode });\n};\n\nconst createResponse = (mocked) => {\n  const mockResponse = new window.Response(mocked.body, {\n    status: mocked.status,\n    headers: {\n      'Content-type': 'text/html',\n      ...mocked.headers\n    }\n  });\n\n  return Promise.resolve(mockResponse);\n};\n\nconst createJSONResponse = (mocked) => {\n  const mockResponse = new window.Response(JSON.stringify(mocked.body), {\n    status: mocked.status,\n    headers: {\n      'Content-type': 'application/json',\n      ...mocked.headers\n    }\n  });\n\n  return Promise.resolve(mockResponse);\n};\n\nconst getResponse = (endpoint: string, options) => {\n  // check if our path has been mocked in code\n  const mocks = options.method === 'GET' ? gets : posts;\n  const codeMock = mocks.find((mock) => mock.endpoint.test(endpoint));\n\n  if (codeMock) {\n    if (typeof codeMock.body === 'string') {\n      // see if we are being mocked to a file\n      if (codeMock.body.startsWith('/')) {\n        endpoint = codeMock.body;\n      } else {\n        return createResponse(codeMock);\n      }\n    } else {\n      return createJSONResponse(codeMock);\n    }\n  }\n\n  // otherwise fetch over http\n  return normalFetch(endpoint, options);\n};\n\nbefore(async () => {\n  normalFetch = window.fetch;\n  stub(window, 'fetch').callsFake(getResponse);\n  await setViewport({ width: 1024, height: 768, deviceScaleFactor: 2 });\n});\n\nafter(() => {\n  (window.fetch as any).restore();\n});\n\nconst mockMapping = {\n  '/test-assets/api/users/admin1.json': [\n    /\\/api\\/v2\\/users.json\\?email=admin1@nyaruka.com/\n  ],\n  '/test-assets/api/users/editor1.json': [\n    /\\/api\\/v2\\/users.json\\?email=editor1@nyaruka.com/\n  ],\n  '/test-assets/api/users/agent1.json': [\n    /\\/api\\/v2\\/users.json\\?email=agent1@nyaruka.com/\n  ],\n  '/test-assets/api/users/viewer1.json': [\n    /\\/api\\/v2\\/users.json\\?email=viewer1@nyaruka.com/\n  ],\n  '/test-assets/contacts/contact-tickets.json': [\n    /\\/api\\/v2\\/tickets.json\\?contact=24d64810-3315-4ff5-be85-48e3fe055bf9/\n  ]\n};\n\nexport const mockAPI = () => {\n  for (const key in mockMapping) {\n    const urls = mockMapping[key];\n    for (const url of urls) {\n      mockGET(url, key);\n    }\n  }\n};\n\nexport const mockGET = (\n  endpoint: RegExp,\n  body: any,\n  headers: any = {},\n  status = '200'\n) => {\n  gets.push({ endpoint, body, headers, status });\n};\n\nexport const mockPOST = (\n  endpoint: RegExp,\n  body: any,\n  headers: any = {},\n  status = '200'\n) => {\n  posts.push({ endpoint, body, headers, status });\n};\n\nexport const clearMockPosts = () => {\n  posts = [];\n};\n\nexport const checkTimers = (clock: any) => {\n  expect(!!clock.timers).to.equal(true, 'Expected timers not found');\n  expect(\n    Object.keys(clock.timers).length,\n    `Timers still to be run ${JSON.stringify(clock.timers)}`\n  ).to.equal(0);\n};\n\nexport const delay = (millis: number) => {\n  return new Promise(function (resolve) {\n    window.setTimeout(resolve, millis);\n  });\n};\n\nexport const assertScreenshot = async (\n  filename: string,\n  clip: Clip,\n  waitFor?: { clock?: any; predicate?: () => boolean }\n) => {\n  if (waitFor) {\n    if (waitFor.clock) {\n      waitFor.clock.restore();\n    }\n    await waitUntil(waitFor.predicate);\n  }\n\n  const threshold = 0.1;\n  const exclude: Clip[] = [];\n\n  try {\n    await (window as any).matchPageSnapshot(\n      `${filename}.png`,\n      clip,\n      exclude,\n      threshold\n    );\n  } catch (error) {\n    if (error.message) {\n      throw new Error(\n        `${error.message} ${\n          error.expected\n            ? `Expected ${error.expected} but got ${error.actual}`\n            : ''\n        } ${error.files ? `\\n${error.files.join('\\n')}` : ''}`\n      );\n    }\n    throw new Error(error);\n  }\n};\n\nexport const getClip = (ele: HTMLElement) => {\n  let clip: any = ele.getBoundingClientRect();\n  if (!clip.width || !clip.height) {\n    clip = ele.shadowRoot.firstElementChild.getBoundingClientRect();\n  }\n\n  const padding = 10;\n  const width = clip.width + padding * 2;\n  const height = clip.height + padding * 2;\n  const y = clip.y - padding;\n  const x = clip.x - padding;\n\n  const newClip = {\n    x,\n    y,\n    width,\n    height,\n    bottom: y + height,\n    right: x + width,\n    top: y,\n    left: x\n  };\n\n  return newClip;\n};\n\nexport const getHTMLAttrs = (attrs: any = {}) => {\n  return Object.keys(attrs)\n    .map((name: string) => `${name}='${attrs[name]}'`)\n    .join(' ');\n};\n\nexport const getHTML = (tag: string, attrs: any = {}) => {\n  return `<${tag} ${getHTMLAttrs(attrs)}></${tag}>`;\n};\n\nexport const loadStore = async () => {\n  const store: Store = await fixture(\n    `<temba-store \n      completion='/test-assets/store/editor.json'\n      groups='/test-assets/store/groups.json'\n      languages='/test-assets/store/languages.json'\n      fields='/test-assets/store/fields.json'\n      users='/test-assets/store/users.json'\n    />`\n  );\n  await store.initialHttpComplete;\n  await store.initialHttpComplete;\n\n  return store;\n};\n\nexport const mockNow = (isodate: string) => {\n  const now = DateTime.fromISO(isodate);\n  // mock the current time\n  replace(DateTime, 'now', () => {\n    return now;\n  });\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nyaruka/temba-components",
-  "version": "0.111.7",
+  "version": "0.113.0",
   "description": "Web components to support rapidpro and related projects",
   "author": "Nyaruka <code@nyaruka.coim>",
   "main": "dist/index.js",

package/src/button/Button.ts

@@ -109,6 +109,10 @@ export class Button extends LitElement {
         color: var(--color-button-primary-text);
       }
 
+      .affirmative {
+        background: var(--color-button-attention);
+      }
+
       .light-button {
         background: var(--color-button-light);
         color: var(--color-button-light-text);

package/src/chat/Chat.ts

@@ -3,7 +3,7 @@ import { property } from 'lit/decorators.js';
 import { RapidElement } from '../RapidElement';
 import { CustomEventType } from '../interfaces';
 import { DEFAULT_AVATAR } from '../webchat/assets';
-import { hashCode, renderAvatar } from '../utils';
+import { hashCode } from '../utils';
 import { renderMarkdown } from '../markdown';
 
 const BATCH_TIME_WINDOW = 60 * 60 * 1000;
@@ -62,6 +62,12 @@ export class Chat extends RapidElement {
 
       .block {
         margin-bottom: 1em;
+        display: flex;
+        flex-direction: row;
+      }
+
+      .block.outgoing {
+        flex-direction: row-reverse;
       }
 
       .block.collapse {
@@ -115,7 +121,7 @@ export class Chat extends RapidElement {
         background: #fff;
       }
 
-      .avatar {
+      temba-user {
         margin-right: 0.6em;
         margin-left: 0.6em;
         width: 2em;
@@ -463,6 +469,7 @@ export class Chat extends RapidElement {
       .bubble-wrap:hover .popup {
         transform: translateY(-120%);
         opacity: 1;
+        transition-delay: 1s;
       }
     `;
   }
@@ -689,46 +696,39 @@ export class Chat extends RapidElement {
     const incoming = this.agent
       ? currentMsg.type !== 'msg_in'
       : currentMsg.type === 'msg_in';
-    const name = currentMsg.user?.name;
-    let avatar = currentMsg.user?.avatar;
 
-    if (!currentMsg.user) {
-      avatar = this.defaultAvatar;
-    }
+    const name = currentMsg.user?.name;
+    const email = currentMsg.user?.email;
 
-    let showAvatar =
+    const showAvatar =
       ((currentMsg.type === 'note' ||
         currentMsg.type === 'msg_in' ||
         currentMsg.type === 'msg_out') &&
         this.agent) ||
       !incoming;
 
-    // if we don't have a name or avatar, skip it
-    showAvatar = showAvatar && (!!avatar || !!name);
-
     return html`
       ${!firstGroup ? timeDisplay : null}
       <div
         class="block  ${incoming ? 'incoming' : 'outgoing'} ${currentMsg.type}"
       >
-        ${msgIds.slice(0, msgIds.length - 1).map((msgId, index) => {
-          const msg = this.msgMap.get(msgId);
-          return html`<div class="row message">
-            ${showAvatar ? html`<div class="avatar"></div>` : null}
-            ${this.renderMessage(msg, index == 0 ? name : null)}
-          </div>`;
-        })}
-        <div class="row latest message">
-          ${showAvatar
-            ? html`<div class="avatar">
-                ${renderAvatar({ name: name, user: { avatar: avatar } })}
-              </div>`
-            : null}
-          ${this.renderMessage(
-            currentMsg,
-            showAvatar && msgIds.length === 1 ? name : null
-          )}
+        <div class="group-messages" style="flex-grow:1">
+          ${msgIds.map((msgId, index) => {
+            const msg = this.msgMap.get(msgId);
+            return html`<div class="row message">
+              ${this.renderMessage(msg, index == 0 ? name : null)}
+            </div>`;
+          })}
         </div>
+        ${showAvatar
+          ? html`<div class="avatar" style="align-self:flex-end">
+              ${email
+                ? html`<temba-user email=${email}></temba-user>`
+                : name
+                ? html`<temba-user fullname=${name}></temba-user>`
+                : html`<temba-user system></temba-user>`}
+            </div>`
+          : null}
       </div>
       ${firstGroup ? timeDisplay : null}
     `;

package/src/compose/Compose.ts

@@ -294,7 +294,6 @@ export class Compose extends FormElement {
   private handleTabChanged() {
     const tabs = this.shadowRoot.querySelector('temba-tabs') as TabPane;
     this.currentTab = tabs.getCurrentTab();
-
     if (this.currentTab && this.currentTab.name === 'Shortcuts') {
       const shortcuts = this.shadowRoot.querySelector(
         'temba-shortcuts'
@@ -406,13 +405,15 @@ export class Compose extends FormElement {
 
   public reset(): void {
     const completion = this.shadowRoot.querySelector('.chatbox') as Completion;
-    completion.textInputElement.value = '';
-    completion.value = '';
-    this.initialText = '';
-    this.currentText = '';
-    this.currentQuickReplies = [];
-    this.currentAttachments = [];
-    this.resetTabs();
+    if (completion) {
+      completion.textInputElement.value = '';
+      completion.value = '';
+      this.initialText = '';
+      this.currentText = '';
+      this.currentQuickReplies = [];
+      this.currentAttachments = [];
+      this.resetTabs();
+    }
   }
 
   private handleQuickReplyChange() {
@@ -439,9 +440,9 @@ export class Compose extends FormElement {
 
     if (line.startsWith('/')) {
       // switch to the shortcuts tab
-      const tabs = this.shadowRoot.querySelector('temba-tabs') as TabPane;
-      tabs.focusTab('Shortcuts');
-
+      if (this.currentTab.name !== 'Shortcuts') {
+        this.getTabs().focusTab('Shortcuts');
+      }
       const shortcuts = this.shadowRoot.querySelector(
         'temba-shortcuts'
       ) as ShortcutList;
@@ -487,19 +488,11 @@ export class Compose extends FormElement {
       tabs.index = num - 1;
     }
 
-    // if they type / as the first character in a line, switch to the shortcut
-    if (evt.key === '/' && this.currentTab.name !== 'Shortcuts') {
-      const line = this.getCurrentLine();
-      const text = line.text.trim();
-      if (text.trim().length === 1) {
-        evt.preventDefault();
-        tabs.index = tabs.tabs.findIndex((tab) => tab.name === 'Shortcuts');
-      }
-    } else if (evt.key === 'Backspace') {
+    if (evt.key === 'Backspace') {
       const line = this.getCurrentLine();
       const text = line.text;
       if (text === '/') {
-        tabs.index = tabs.tabs.findIndex((tab) => tab.name === 'Reply');
+        tabs.focusTab('Reply');
       }
     }
 
@@ -538,7 +531,7 @@ export class Compose extends FormElement {
   }
 
   public resetTabs() {
-    (this.shadowRoot.querySelector('temba-tabs') as TabPane).index = 0;
+    this.getTabs().focusTab('Reply');
   }
 
   public getTabs(): TabPane {
@@ -635,7 +628,6 @@ export class Compose extends FormElement {
       <temba-tabs
         embedded
         focusedname
-        index="0"
         @temba-context-changed=${this.handleTabChanged}
         refresh="${(this.currentAttachments || []).length}|${this.index}|${this
           .currentQuickReplies.length}|${showOptins}|${this