@nyaruka/temba-components 0.16.0 → 0.18.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.
Files changed (91) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/dist/a525ddb7.js +1 -0
  3. package/dist/index.js +1 -1
  4. package/dist/sw.js +1 -1
  5. package/dist/sw.js.map +1 -1
  6. package/dist/templates/components-body.html +1 -1
  7. package/dist/templates/components-head.html +1 -1
  8. package/out-tsc/src/button/Button.js +1 -0
  9. package/out-tsc/src/button/Button.js.map +1 -1
  10. package/out-tsc/src/contacts/ContactChat.js +81 -33
  11. package/out-tsc/src/contacts/ContactChat.js.map +1 -1
  12. package/out-tsc/src/contacts/ContactDetails.js +22 -22
  13. package/out-tsc/src/contacts/ContactDetails.js.map +1 -1
  14. package/out-tsc/src/contacts/ContactHistory.js +132 -139
  15. package/out-tsc/src/contacts/ContactHistory.js.map +1 -1
  16. package/out-tsc/src/contacts/events.js +110 -47
  17. package/out-tsc/src/contacts/events.js.map +1 -1
  18. package/out-tsc/src/interfaces.js.map +1 -1
  19. package/out-tsc/src/list/ContactList.js +32 -17
  20. package/out-tsc/src/list/ContactList.js.map +1 -1
  21. package/out-tsc/src/list/TembaList.js +10 -3
  22. package/out-tsc/src/list/TembaList.js.map +1 -1
  23. package/out-tsc/src/list/TembaMenu.js +7 -2
  24. package/out-tsc/src/list/TembaMenu.js.map +1 -1
  25. package/out-tsc/src/loading/Loading.js +9 -1
  26. package/out-tsc/src/loading/Loading.js.map +1 -1
  27. package/out-tsc/src/options/Options.js +14 -2
  28. package/out-tsc/src/options/Options.js.map +1 -1
  29. package/out-tsc/src/select/Select.js +23 -5
  30. package/out-tsc/src/select/Select.js.map +1 -1
  31. package/out-tsc/src/tip/Tip.js +6 -0
  32. package/out-tsc/src/tip/Tip.js.map +1 -1
  33. package/out-tsc/src/vectoricon/VectorIcon.js +17 -5
  34. package/out-tsc/src/vectoricon/VectorIcon.js.map +1 -1
  35. package/out-tsc/test/temba-contact-history.test.js +2 -2
  36. package/out-tsc/test/temba-contact-history.test.js.map +1 -1
  37. package/package.json +1 -1
  38. package/screenshots/truth/contacts/history-expanded.png +0 -0
  39. package/screenshots/truth/contacts/history.png +0 -0
  40. package/screenshots/truth/list/items-selected.png +0 -0
  41. package/screenshots/truth/list/items-updated.png +0 -0
  42. package/screenshots/truth/list/items.png +0 -0
  43. package/screenshots/truth/modax/simple.png +0 -0
  44. package/screenshots/truth/options/block.png +0 -0
  45. package/screenshots/truth/select/disabled-multi-selection.png +0 -0
  46. package/screenshots/truth/select/disabled-selection.png +0 -0
  47. package/screenshots/truth/select/disabled.png +0 -0
  48. package/screenshots/truth/select/embedded.png +0 -0
  49. package/screenshots/truth/select/expression-selected.png +0 -0
  50. package/screenshots/truth/select/expressions.png +0 -0
  51. package/screenshots/truth/select/functions.png +0 -0
  52. package/screenshots/truth/select/local-options.png +0 -0
  53. package/screenshots/truth/select/remote-options.png +0 -0
  54. package/screenshots/truth/select/search-enabled.png +0 -0
  55. package/screenshots/truth/select/search-multi-no-matches.png +0 -0
  56. package/screenshots/truth/select/search-selected-focus.png +0 -0
  57. package/screenshots/truth/select/search-selected.png +0 -0
  58. package/screenshots/truth/select/search-with-selected.png +0 -0
  59. package/screenshots/truth/select/searching.png +0 -0
  60. package/screenshots/truth/select/selected-multi.png +0 -0
  61. package/screenshots/truth/select/selected-single.png +0 -0
  62. package/screenshots/truth/select/with-placeholder.png +0 -0
  63. package/screenshots/truth/select/without-placeholder.png +0 -0
  64. package/screenshots/truth/textinput/date-form.png +0 -0
  65. package/screenshots/truth/textinput/input-disabled.png +0 -0
  66. package/screenshots/truth/textinput/input-form.png +0 -0
  67. package/screenshots/truth/textinput/input-placeholder.png +0 -0
  68. package/screenshots/truth/textinput/input-updated.png +0 -0
  69. package/screenshots/truth/textinput/input.png +0 -0
  70. package/screenshots/truth/textinput/textarea.png +0 -0
  71. package/screenshots/truth/tip/bottom.png +0 -0
  72. package/screenshots/truth/tip/left.png +0 -0
  73. package/screenshots/truth/tip/right.png +0 -0
  74. package/screenshots/truth/tip/top.png +0 -0
  75. package/src/button/Button.ts +1 -0
  76. package/src/contacts/ContactChat.ts +93 -33
  77. package/src/contacts/ContactDetails.ts +23 -23
  78. package/src/contacts/ContactHistory.ts +157 -160
  79. package/src/contacts/events.ts +117 -48
  80. package/src/interfaces.ts +3 -0
  81. package/src/list/ContactList.ts +39 -20
  82. package/src/list/TembaList.ts +13 -4
  83. package/src/list/TembaMenu.ts +7 -2
  84. package/src/loading/Loading.ts +8 -1
  85. package/src/options/Options.ts +14 -2
  86. package/src/select/Select.ts +28 -6
  87. package/src/tip/Tip.ts +6 -0
  88. package/src/vectoricon/VectorIcon.ts +17 -5
  89. package/test/temba-contact-history.test.ts +2 -2
  90. package/test-assets/style.css +4 -1
  91. package/dist/228cf25e.js +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"events.js","sourceRoot":"","sources":["../../../src/contacts/events.ts"],"names":[],"mappings":"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","sourcesContent":["import { css } from 'lit-element';\nimport { html, TemplateResult } from 'lit-html';\nimport { Msg, ObjectReference, User } from '../interfaces';\nimport { getClasses, oxford, oxfordFn, oxfordNamed, timeSince } from '../utils';\nimport { getDisplayName } from './helpers';\n\nexport const getEventStyles = () => {\n return css`\n .grouping {\n padding: 0 2em;\n margin: 0 -1em;\n }\n\n .grouping.verbose {\n background: #f9f9f9;\n max-height: 1px;\n border-top: 1px solid #f9f9f9;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 1.5em;\n color: #efefef;\n --color-link-primary: rgba(38, 166, 230, 1);\n pointer-events: none;\n }\n\n .grouping.verbose.expanded,\n .grouping.verbose .event-count {\n pointer-events: auto;\n }\n\n .grouping.verbose temba-icon {\n margin-top: 3px;\n }\n\n .grouping.verbose > .event,\n .grouping.verbose > pre {\n max-height: 0px;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 0;\n opacity: 0;\n }\n\n .grouping.verbose .attn {\n color: #fff;\n }\n\n .event-count {\n position: relative;\n top: -1.2em;\n font-size: 0.8em;\n text-align: center;\n border: 2px solid #f9f9f9;\n background: #fff;\n margin: 0 auto;\n display: table;\n padding: 3px 10px;\n font-weight: 400;\n color: #777;\n border-radius: var(--curvature);\n cursor: pointer;\n min-width: 0%;\n opacity: 1;\n transition: all var(--transition-speed) ease-in, opacity 0.1ms,\n margin-top 0ms;\n }\n\n .closing .grouping-close-button {\n opacity: 0 !important;\n transition: none !important;\n }\n\n .event-count {\n z-index: 1;\n margin-bottom: 1em;\n }\n\n .event-count:hover {\n padding: 3px 10px;\n min-width: 50%;\n background: #f9f9f9;\n color: #333;\n }\n\n .expanded .event-count {\n opacity: 0;\n margin-top: -42px;\n z-index: 0;\n pointer-events: none;\n }\n\n .grouping.flows {\n margin-left: 1em;\n margin-right: 1em;\n margin-bottom: 1.5em;\n\n border: 1px solid #f2f2f2;\n border-radius: var(--curvature);\n padding: 0.5em 1em;\n }\n\n .grouping.flows .event {\n margin: 0;\n padding: 0;\n }\n\n .grouping.tickets {\n margin-bottom: 2em;\n }\n\n pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n }\n\n .grouping.verbose.closing {\n opacity: 0 !important;\n padding: 0 !important;\n background: #f9f9f9 !important;\n max-height: 1px !important;\n border-top: 1px solid #f9f9f9 !important;\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n }\n\n .grouping.verbose.closing .event,\n .grouping.verbose.closing pre {\n max-height: 0px;\n }\n\n .grouping.verbose.expanded {\n transition: all var(--transition-speed)\n cubic-bezier(0.68, -0.55, 0.265, 1.05),\n color 0.1ms;\n background: #444;\n color: #efefef;\n max-height: 1000px;\n border-top: 1px solid #f1f1f1;\n padding: 2em;\n margin-left: 1em;\n margin-right: 1em;\n border-radius: var(--curvature);\n padding-bottom: 1em;\n box-shadow: inset 0px 11px 4px -15px #000, inset 0px -11px 4px -15px #000;\n }\n\n .grouping.verbose.expanded .event,\n .grouping.verbose.expanded pre {\n max-height: 500px;\n margin-bottom: 0.5em;\n opacity: 1;\n transition: all var(--transition-speed) ease-in-out;\n }\n\n .grouping-close-button {\n opacity: 0;\n float: right;\n margin-top: -1em !important;\n margin-right: -1em !important;\n fill: #f2f2f2;\n transition: opacity var(--transition-speed) ease-in;\n }\n\n .grouping.verbose.expanded:hover .grouping-close-button {\n opacity: 1;\n }\n\n .grouping.messages,\n .grouping.tickets {\n display: flex;\n flex-direction: column;\n }\n\n .event {\n margin-bottom: 1em;\n border-radius: var(--curvature);\n flex-grow: 1;\n }\n\n .msg {\n padding: var(--event-padding);\n border-radius: 8px;\n border: 2px solid rgba(100, 100, 100, 0.1);\n max-width: 300px;\n }\n\n .event.msg_received .msg {\n background: rgba(200, 200, 200, 0.1);\n }\n\n .event.msg_created,\n .event.broadcast_created,\n .event.ivr_created,\n .tickets .event.ticket_note_added {\n align-self: flex-end;\n }\n\n .event.msg_created .msg,\n .event.broadcast_created .msg,\n .event.ivr_created .msg {\n background: rgb(231, 243, 255);\n }\n\n .webhook_called {\n fill: #e68628;\n word-break: break-all;\n }\n\n .webhook_called .failed {\n fill: var(--color-error);\n color: var(--color-error);\n }\n\n .input_labels_added,\n .contact_name_changed,\n .contact_field_changed,\n .contact_urns_changed,\n .contact_language_changed,\n .run_result_changed {\n fill: rgba(1, 193, 175, 1);\n }\n\n .email_sent {\n fill: #8e5ea7;\n }\n\n .contact_groups_changed .added {\n fill: #309c42;\n }\n .contact_groups_changed .removed {\n fill: var(--color-error);\n }\n\n .event.error .description,\n .event.failure .description {\n color: var(--color-error);\n }\n\n .description.error {\n color: var(--color-error);\n }\n\n .info {\n border: 1px solid rgba(100, 100, 100, 0.2);\n background: rgba(10, 10, 10, 0.02);\n }\n\n .tickets .ticket_note_added {\n max-width: 300px;\n }\n\n .tickets .note-summary {\n display: flex;\n flex-direction: row;\n line-height: 0.5;\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 8px 3px;\n }\n\n .tickets .ticket_note_added .description {\n border: 2px solid rgba(100, 100, 100, 0.1);\n background: rgb(255, 249, 194);\n padding: var(--event-padding);\n border-radius: 8px;\n }\n\n .channel_event {\n fill: rgb(230, 230, 230);\n }\n\n .airtime_transferred,\n .flow_exited,\n .flow_entered,\n .ticket_opened,\n .ticket_reopened,\n .ticket_closed,\n .call_started,\n .campaign_fired {\n fill: rgba(223, 65, 159, 1);\n }\n\n .ticket_opened {\n padding: 0em 1em;\n }\n\n .ticket_opened temba-icon.clickable[name='check'] {\n fill: rgba(100, 100, 100, 1);\n }\n\n .ticket_opened .active {\n color: var(--color-text);\n }\n\n .ticket_closed .inactive .subtext {\n display: none;\n }\n\n .attn {\n color: var(--color-text);\n }\n\n .flow_exited,\n .flow_entered {\n align-self: center;\n max-width: 80%;\n display: flex;\n flex-direction: row;\n }\n\n .flow_exited temba-icon,\n .flow_entered temba-icon {\n margin-top: 5px;\n }\n\n .event {\n display: flex;\n align-items: center;\n }\n\n .event .description {\n flex-grow: 1;\n }\n\n .msg-summary {\n display: flex;\n line-height: 0.5;\n\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 6px 3px;\n }\n\n .msg-summary temba-icon[name='log'] {\n --icon-color: rgba(0, 0, 0, 0.2);\n }\n\n .msg-summary temba-icon[name='log']:hover {\n --icon-color: var(--color-link-primary-hover);\n cursor: pointer;\n }\n\n .msg-summary temba-icon.error[name='log'] {\n --icon-color: rgba(var(--error-rgb), 0.75);\n }\n\n .msg-summary temba-icon.error[name='log']:hover {\n --icon-color: var(--color-error);\n cursor: pointer;\n }\n\n .msg-summary temba-icon[name='megaphone'] {\n --icon-color: rgba(90, 90, 90, 0.5);\n }\n\n .msg-summary * {\n display: flex;\n margin-right: 1px;\n margin-left: 1px;\n }\n\n .time {\n padding: 0.3em 1px;\n }\n\n .status {\n padding: 0.3em 3px;\n }\n\n .separator {\n padding: 0.3em 0px;\n }\n\n .recipients {\n padding: 0.3em 3px;\n }\n\n .verbose temba-icon,\n .flows temba-icon,\n .tickets temba-icon {\n margin-right: 0.75em;\n }\n\n temba-icon[name='check'] {\n margin-top: 3px;\n }\n\n .attn {\n display: inline-block;\n font-weight: 500;\n margin: 0px 2px;\n }\n\n .subtext {\n font-size: 80%;\n }\n\n .body-pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n font-size: 90%;\n }\n\n a {\n color: var(--color-link-primary);\n }\n\n a:hover {\n text-decoration: underline;\n color: var(--color-link-primary-hover);\n }\n\n temba-icon[name='alert-triangle'] {\n --icon-color: var(--color-error);\n }\n\n .flow {\n fill: #ddd;\n background: #fff;\n width: 18px;\n height: 18px;\n padding-top: 4px;\n padding-left: 9px;\n border: 0px solid #f3f3f3;\n }\n\n .assigned {\n color: #777;\n max-width: 300px;\n margin-left: auto;\n margin-right: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 10px;\n }\n\n .assigned .attn {\n color: #777;\n }\n `;\n};\n\nconst FLOW_USER_ID = -1;\n\nexport interface EventGroup {\n type: string;\n events: ContactEvent[];\n open: boolean;\n closing: boolean;\n}\n\nexport enum Events {\n MESSAGE_CREATED = 'msg_created',\n MESSAGE_RECEIVED = 'msg_received',\n BROADCAST_CREATED = 'broadcast_created',\n IVR_CREATED = 'ivr_created',\n FLOW_ENTERED = 'flow_entered',\n FLOW_EXITED = 'flow_exited',\n RUN_RESULT_CHANGED = 'run_result_changed',\n CONTACT_FIELD_CHANGED = 'contact_field_changed',\n CONTACT_GROUPS_CHANGED = 'contact_groups_changed',\n CONTACT_NAME_CHANGED = 'contact_name_changed',\n CONTACT_URNS_CHANGED = 'contact_urns_changed',\n CAMPAIGN_FIRED = 'campaign_fired',\n CHANNEL_EVENT = 'channel_event',\n CONTACT_LANGUAGE_CHANGED = 'contact_language_changed',\n WEBHOOK_CALLED = 'webhook_called',\n AIRTIME_TRANSFERRED = 'airtime_transferred',\n CALL_STARTED = 'call_started',\n EMAIL_SENT = 'email_sent',\n INPUT_LABELS_ADDED = 'input_labels_added',\n NOTE_CREATED = 'note_created',\n TICKET_ASSIGNED = 'ticket_assigned',\n TICKET_NOTE_ADDED = 'ticket_note_added',\n TICKET_CLOSED = 'ticket_closed',\n TICKET_OPENED = 'ticket_opened',\n TICKET_REOPENED = 'ticket_reopened',\n ERROR = 'error',\n FAILURE = 'failure',\n}\n\nexport interface ContactEvent {\n type: string;\n created_on: string;\n}\n\nexport interface ChannelEvent extends ContactEvent {\n channel_event_type: string;\n duration: number;\n}\n\nexport interface ContactLanguageChangedEvent extends ContactEvent {\n language: string;\n step_uuid: string;\n session_uuid: string;\n}\n\nexport interface MsgEvent extends ContactEvent {\n msg: Msg;\n status: string;\n logs_url: string;\n msg_type: string;\n recipient_count?: number;\n created_by?: User;\n}\n\nexport interface FlowEvent extends ContactEvent {\n flow: ObjectReference;\n status: string;\n}\n\nexport interface EmailSentEvent extends ContactEvent {\n to: string[];\n subject: string;\n body: string;\n}\n\nexport interface URNsChangedEvent extends ContactEvent {\n urns: string[];\n}\n\nexport interface TicketEvent extends ContactEvent {\n note?: string;\n assignee?: User;\n ticket: {\n uuid: string;\n ticketer: ObjectReference;\n subject: string;\n body: string;\n external_id?: string;\n closed_on?: string;\n opened_on?: string;\n };\n created_by?: User;\n}\n\nexport interface LabelsAddedEvent extends ContactEvent {\n labels: ObjectReference[];\n}\n\nexport interface NameChangedEvent extends ContactEvent {\n name: string;\n}\n\nexport interface UpdateFieldEvent extends ContactEvent {\n field: { key: string; name: string };\n value: { text: string };\n}\n\nexport interface ErrorMessageEvent extends ContactEvent {\n text: string;\n}\n\nexport interface UpdateResultEvent extends ContactEvent {\n name: string;\n value: string;\n category: string;\n input: string;\n}\n\nexport interface ContactGroupsEvent extends ContactEvent {\n groups_added: ObjectReference[];\n groups_removed: ObjectReference[];\n}\n\nexport interface WebhookEvent extends ContactEvent {\n status: string;\n status_code: number;\n elapsed_ms: number;\n logs_url: string;\n url: string;\n}\n\nexport interface AirtimeTransferredEvent extends ContactEvent {\n sender: string;\n recipient: string;\n currency: string;\n desired_amount: string;\n actual_amount: string;\n logs_url: string;\n}\n\nexport type CallStartedEvent = ContactEvent;\nexport interface CampaignFiredEvent extends ContactEvent {\n campaign: { id: number; name: string };\n campaign_event: {\n id: number;\n offset_display: string;\n relative_to: { key: string; name: string };\n };\n fired_result: string;\n}\n\nexport interface ContactHistoryPage {\n has_older: boolean;\n recent_only: boolean;\n next_before: number;\n next_after: number;\n start_date: Date;\n events: ContactEvent[];\n}\n\nexport const getEventGroupType = (event: ContactEvent, ticket: string) => {\n if (!event) {\n return 'messages';\n }\n switch (event.type) {\n case Events.TICKET_ASSIGNED:\n case Events.TICKET_NOTE_ADDED:\n case Events.TICKET_OPENED:\n case Events.TICKET_CLOSED:\n case Events.TICKET_REOPENED:\n if (!ticket || (event as TicketEvent).ticket.uuid === ticket) {\n return 'tickets';\n }\n break;\n case Events.FLOW_ENTERED:\n case Events.FLOW_EXITED:\n return 'flows';\n case Events.BROADCAST_CREATED:\n case Events.MESSAGE_CREATED:\n case Events.MESSAGE_RECEIVED:\n case Events.IVR_CREATED:\n return 'messages';\n }\n return 'verbose';\n};\n\nexport const renderAvatar = (user: User, agent = -1) => {\n const current = user && user.id === agent;\n if (user.id === FLOW_USER_ID || !user || !user.first_name) {\n return html`<temba-tip text=\"Automated message\" position=\"top\"\n ><div class=\"avatar flow\" style=\"margin-top:0.5em\">\n <temba-icon size=\"1\" name=\"activity\" /></div\n ></temba-tip>`;\n } else {\n return html`<temba-tip\n text=\"${user.first_name + ' ' + user.last_name}\"\n position=\"top\"\n >\n <div\n class=\"avatar\"\n style=\"\n border-radius: 9999px; \n display:flex;\n align-items:center;\n border: 2px solid rgba(0,0,0,.05);\n background: ${current ? 'var(--color-primary-dark)' : '#eee'};\n color: ${current ? '#fff' : '#999'} ;\n font-weight: 400;\n padding: 0.5em;\n line-height:1.2em;\n \"\n >\n ${user.first_name[0] + user.last_name[0]}\n </div>\n </temba-tip>`;\n }\n};\n\nexport const renderMsgEvent = (\n event: MsgEvent,\n agent: number\n): TemplateResult => {\n const isInbound = event.type === Events.MESSAGE_RECEIVED;\n const isError = event.status === 'E' || event.status === 'F';\n return html` <div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n <div class=\"msg\">${event.msg.text}</div>\n <div\n class=\"msg-summary\"\n style=\"flex-direction:row${isInbound ? '-reverse' : ''}\"\n >\n <div style=\"flex-grow:1\"></div>\n ${event.logs_url\n ? html`\n <a class=\"icon-link\" target=\"_logs\" href=\"${event.logs_url}\">\n <temba-icon\n name=\"log\"\n class=\"${isError ? 'error' : ''}\"\n ></temba-icon\n ></a>\n `\n : isError\n ? html`<temba-icon\n title=\"Message delivery error\"\n name=\"alert-triangle\"\n ></temba-icon>`\n : null}\n ${event.recipient_count > 1\n ? html`<temba-icon size=\"1\" name=\"megaphone\"></temba-icon>\n <div class=\"recipients\">${event.recipient_count} contacts</div>\n <div class=\"separator\">•</div>`\n : null}\n <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\n </div>\n </div>\n\n ${!isInbound\n ? html`<div style=\"margin-left:0.8em;margin-top:0.3em\">\n ${event.msg.created_by\n ? html`<div style=\"font-size:0.8em\">\n ${renderAvatar(event.msg.created_by, agent)}\n </div>`\n : renderAvatar({ id: FLOW_USER_ID })}\n </div>`\n : null}\n </div>`;\n};\n\nexport const renderFlowEvent = (event: FlowEvent): TemplateResult => {\n let verb = 'Interrupted';\n let icon = 'x-octagon';\n\n if (event.status !== 'I') {\n if (event.type === Events.FLOW_ENTERED) {\n verb = 'Started';\n icon = 'flow';\n } else {\n verb = 'Completed';\n icon = 'flow';\n }\n }\n\n return html`\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${verb}\n <a target=\"_\" href=\"/flow/editor/${event.flow.uuid}/\"\n >${event.flow.name}</a\n >\n </div>\n `;\n};\n\nexport const renderResultEvent = (event: UpdateResultEvent): TemplateResult => {\n if (event.name.startsWith('_')) {\n return null;\n }\n return html`\n <temba-icon name=\"flow\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">${event.name}</div>\n to\n <div class=\"attn\">${event.value}</div>\n ${event.category\n ? html`with category\n <div class=\"attn\">${event.category}</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderUpdateEvent = (event: UpdateFieldEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">${event.field.name}</div>\n to\n <div class=\"attn\">${event.value.text}</div>\n </div>\n `;\n};\n\nexport const renderNameChanged = (event: NameChangedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">Name</div>\n to\n <div class=\"attn\">${event.name}</div>\n </div>\n `;\n};\n\nexport const renderContactURNsChanged = (\n event: URNsChangedEvent\n): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">URNs</div>\n to\n ${oxfordFn(\n event.urns,\n (urn: string) =>\n html`<div class=\"attn\">${urn.split(':')[1].split('?')[0]}</div>`\n )}\n </div>\n </div>\n `;\n};\n\nexport const renderEmailSent = (event: EmailSentEvent): TemplateResult => {\n return html`\n <temba-icon name=\"mail\"></temba-icon>\n <div class=\"description\">\n Email sent to\n <div class=\"attn\">${oxford(event.to, 'and')}</div>\n with subject\n <div class=\"attn\">${event.subject}</div>\n </div>\n `;\n};\n\nexport const renderLabelsAdded = (event: LabelsAddedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"tag\"></temba-icon>\n <div class=\"description\">\n Message labeled with\n <div class=\"attn\">${oxfordNamed(event.labels, 'and')}</div>\n </div>\n `;\n};\n\nexport const renderNoteCreated = (\n event: TicketEvent,\n agent: number\n): TemplateResult => {\n return html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n <div class=\"description\">${event.note}</div>\n <div class=\"note-summary\">\n <div style=\"flex-grow:1\"></div>\n <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\n </div>\n </div>\n <div style=\"margin-left:0.8em;margin-top:0.3em;font-size:0.8em\">\n ${renderAvatar(event.created_by, agent)}\n </div>\n </div>`;\n};\n\nexport const renderTicketClosed = (event: TicketEvent): TemplateResult => {\n const closed = new Date(event.ticket.opened_on);\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${getDisplayName(event.created_by)} closed this ticket\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(closed, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nconst getTicketIcon = (event: TicketEvent) => {\n let icon = 'inbox';\n if (event.ticket.ticketer.name.indexOf('Email') > -1) {\n icon = 'mail';\n } else if (event.ticket.ticketer.name.indexOf('Zendesk') > -1) {\n icon = 'zendesk';\n }\n return icon;\n};\n\nexport const renderTicketAction = (\n event: TicketEvent,\n action: string\n): TemplateResult => {\n const reopened = new Date(event.created_on);\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${getDisplayName(event.created_by)} ${action} this ticket\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(reopened, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketAssigned = (event: TicketEvent): TemplateResult => {\n const created = new Date(event.created_on);\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${event.assignee\n ? event.assignee.id === event.created_by.id\n ? html`${getDisplayName(event.created_by)} took this ticket`\n : html`${getDisplayName(event.created_by)} assigned this ticket to\n <div class=\"attn\">${getDisplayName(event.assignee)}</div>`\n : html`${getDisplayName(event.created_by)} unassigned this ticket`}\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(created, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketOpened = (\n event: TicketEvent,\n handleClose: (uuid: string) => void\n): TemplateResult => {\n const icon = getTicketIcon(event);\n return html`\n <temba-icon size=\"1.5\" name=\"${icon}\"></temba-icon>\n\n <div class=\"active\" style=\"flex-grow:1;\">\n Opened\n <div class=\"attn\">${event.ticket.subject}</div>\n <div class=\"subtext\">${timeSince(new Date(event.created_on))}</div>\n </div>\n ${handleClose\n ? html`\n <temba-tip text=\"Resolve\" position=\"left\" style=\"width:1.5em\">\n <temba-icon\n class=\"clickable\"\n size=\"1.5\"\n name=\"check\"\n @click=${() => {\n handleClose(event.ticket.uuid);\n }}\n ?clickable=${open}\n />\n </temba-tip>\n `\n : null}\n `;\n};\n\nexport const renderErrorMessage = (\n event: ErrorMessageEvent\n): TemplateResult => {\n return html`\n <temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description\">\n ${event.text}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderWebhookEvent = (event: WebhookEvent): TemplateResult => {\n return html`\n <div\n class=\"${event.status === 'success' ? '' : 'failed'}\"\n style=\"display: flex\"\n >\n <temba-icon name=\"external-link\"></temba-icon>\n <div class=\"description\">\n ${event.status === 'success'\n ? html`Successfully called ${event.url}`\n : html`Failed to call ${event.url}`}\n </div>\n </div>\n `;\n};\n\nexport const renderAirtimeTransferredEvent = (\n event: AirtimeTransferredEvent\n): TemplateResult => {\n if (parseFloat(event.actual_amount) === 0) {\n return html`<temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description error\">Airtime transfer failed</div>`;\n }\n\n return html`<temba-icon name=\"dollar-sign\"></temba-icon>\n <div class=\"description\">\n Transferred\n <div class=\"attn\">${event.actual_amount} ${event.currency}</div>\n of airtime\n </div>`;\n};\n\nexport const renderCallStartedEvent = (): TemplateResult => {\n return html`<temba-icon name=\"phone\"></temba-icon>\n <div class=\"description\">Call Started</div>`;\n};\n\nexport const renderContactLanguageChangedEvent = (\n event: ContactLanguageChangedEvent\n): TemplateResult => {\n return html`<temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">Language updated to ${event.language}</div>`;\n};\n\nexport const renderChannelEvent = (event: ChannelEvent): TemplateResult => {\n let eventMessage = '';\n let icon = 'phone';\n\n if (event.channel_event_type === 'mt_miss') {\n eventMessage = 'Missed outgoing call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'mo_miss') {\n eventMessage = 'Missed incoming call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'new_conversation') {\n eventMessage = 'Started Conversation';\n icon = 'zap';\n } else if (event.channel_event_type === 'welcome_message') {\n eventMessage = 'Welcome Message Sent';\n icon = 'zap';\n } else if (event.channel_event_type === 'referral') {\n eventMessage = 'Referred';\n icon = 'zap';\n } else if (event.channel_event_type === 'follow') {\n eventMessage = 'Followed';\n icon = 'zap';\n } else if (event.channel_event_type === 'stop_contact') {\n eventMessage = 'Stopped';\n icon = 'x-octagon';\n } else if (event.channel_event_type === 'mt_call') {\n eventMessage = 'Outgoing Phone Call';\n } else if (event.channel_event_type == 'mo_call') {\n eventMessage = 'Incoming Phone call';\n }\n\n return html`<temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">${eventMessage}</div>`;\n};\n\nexport const renderCampaignFiredEvent = (\n event: CampaignFiredEvent\n): TemplateResult => {\n return html`<temba-icon name=\"campaign\"></temba-icon>\n <div class=\"description\">\n Campaign\n <a href=\"/campaign/read/${event.campaign.id}\" target=\"_\"\n >${event.campaign.name}</a\n >\n ${event.fired_result === 'S' ? 'skipped' : 'triggered'}\n <a href=\"/campaignevent/read/${event.campaign_event.id}\" target=\"_\">\n ${event.campaign_event.offset_display}\n ${event.campaign_event.relative_to.name}</a\n >\n </div>`;\n};\n\nexport const renderContactGroupsEvent = (\n event: ContactGroupsEvent\n): TemplateResult => {\n const groups = event.groups_added || event.groups_removed;\n const added = !!event.groups_added;\n return html`\n <temba-icon\n name=\"users\"\n class=\"${getClasses({ added: added, removed: !added })}\"\n ></temba-icon>\n <div class=\"description\">\n ${added ? 'Added to' : 'Removed from'}\n ${oxfordFn(\n groups,\n (group: ObjectReference) =>\n html`<a target=\"_\" href=\"/contact/filter/${group.uuid}\"\n >${group.name}</a\n >`\n )}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n"]}
1
+ {"version":3,"file":"events.js","sourceRoot":"","sources":["../../../src/contacts/events.ts"],"names":[],"mappings":"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","sourcesContent":["import { css } from 'lit-element';\nimport { html, TemplateResult } from 'lit-html';\nimport { Msg, ObjectReference, User } from '../interfaces';\nimport { getClasses, oxford, oxfordFn, oxfordNamed, timeSince } from '../utils';\nimport { getDisplayName } from './helpers';\n\nexport const getEventStyles = () => {\n return css`\n .grouping {\n padding: 0 2em;\n margin: 0 -1em;\n }\n\n .grouping.verbose {\n background: #f9f9f9;\n max-height: 1px;\n border-top: 1px solid #f9f9f9;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 1.5em;\n color: #efefef;\n --color-link-primary: rgba(38, 166, 230, 1);\n pointer-events: none;\n }\n\n .grouping.verbose.expanded,\n .grouping.verbose .event-count {\n pointer-events: auto;\n }\n\n .grouping.verbose temba-icon {\n margin-top: 3px;\n }\n\n .grouping.verbose > .event,\n .grouping.verbose > pre {\n max-height: 0px;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 0;\n opacity: 0;\n }\n\n .grouping.verbose .attn {\n color: #fff;\n }\n\n .event-count {\n position: relative;\n top: -1.2em;\n font-size: 0.8em;\n text-align: center;\n border: 2px solid #f9f9f9;\n background: #fff;\n margin: 0 auto;\n display: table;\n padding: 3px 10px;\n font-weight: 400;\n color: #777;\n border-radius: var(--curvature);\n cursor: pointer;\n min-width: 0%;\n opacity: 1;\n transition: all var(--transition-speed) ease-in, opacity 0.1ms,\n margin-top 0ms;\n }\n\n .closing .grouping-close-button {\n opacity: 0 !important;\n transition: none !important;\n }\n\n .event-count {\n z-index: 1;\n margin-bottom: 1em;\n }\n\n .event-count:hover {\n padding: 3px 10px;\n min-width: 50%;\n background: #f9f9f9;\n color: #333;\n }\n\n .expanded .event-count {\n opacity: 0;\n margin-top: -42px;\n z-index: 0;\n pointer-events: none;\n }\n\n .grouping.flows {\n margin-left: 1em;\n margin-right: 1em;\n margin-bottom: 1.5em;\n\n border: 1px solid #f2f2f2;\n border-radius: var(--curvature);\n padding: 0.5em 1em;\n }\n\n .grouping.flows .event {\n margin: 0;\n padding: 0;\n }\n\n .grouping.tickets {\n margin-bottom: 2em;\n }\n\n pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n }\n\n .grouping.verbose.closing {\n opacity: 0 !important;\n padding: 0 !important;\n background: #f9f9f9 !important;\n max-height: 1px !important;\n border-top: 1px solid #f9f9f9 !important;\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n }\n\n .grouping.verbose.closing .event,\n .grouping.verbose.closing pre {\n max-height: 0px;\n }\n\n .grouping.verbose.expanded {\n transition: all var(--transition-speed)\n cubic-bezier(0.68, -0.55, 0.265, 1.05),\n color 0.1ms;\n background: #444;\n color: #efefef;\n max-height: 1000px;\n border-top: 1px solid #f1f1f1;\n padding: 2em;\n margin-left: 1em;\n margin-right: 1em;\n border-radius: var(--curvature);\n padding-bottom: 1em;\n box-shadow: inset 0px 11px 4px -15px #000, inset 0px -11px 4px -15px #000;\n }\n\n .grouping.verbose.expanded .event,\n .grouping.verbose.expanded pre {\n max-height: 500px;\n margin-bottom: 0.5em;\n opacity: 1;\n transition: all var(--transition-speed) ease-in-out;\n }\n\n .grouping-close-button {\n opacity: 0;\n float: right;\n margin-top: -1em !important;\n margin-right: -1em !important;\n fill: #f2f2f2;\n transition: opacity var(--transition-speed) ease-in;\n }\n\n .grouping.verbose.expanded:hover .grouping-close-button {\n opacity: 1;\n }\n\n .grouping.messages,\n .grouping.tickets {\n display: flex;\n flex-direction: column;\n }\n\n .event {\n margin-bottom: 1em;\n border-radius: var(--curvature);\n flex-grow: 1;\n }\n\n .msg {\n padding: var(--event-padding);\n border-radius: 8px;\n border: 2px solid rgba(100, 100, 100, 0.1);\n max-width: 300px;\n }\n\n .event.msg_received .msg {\n background: rgba(200, 200, 200, 0.1);\n }\n\n .event.msg_created,\n .event.broadcast_created,\n .event.ivr_created,\n .tickets .event.ticket_note_added {\n align-self: flex-end;\n }\n\n .event.msg_created .msg,\n .event.broadcast_created .msg,\n .event.ivr_created .msg {\n background: rgb(231, 243, 255);\n }\n\n .webhook_called {\n fill: #e68628;\n word-break: break-all;\n }\n\n .webhook_called .failed {\n fill: var(--color-error);\n color: var(--color-error);\n }\n\n .input_labels_added,\n .contact_name_changed,\n .contact_field_changed,\n .contact_urns_changed,\n .contact_language_changed,\n .run_result_changed {\n fill: rgba(1, 193, 175, 1);\n }\n\n .email_sent {\n fill: #8e5ea7;\n }\n\n .contact_groups_changed .added {\n fill: #309c42;\n }\n .contact_groups_changed .removed {\n fill: var(--color-error);\n }\n\n .event.error .description,\n .event.failure .description {\n color: var(--color-error);\n }\n\n .description.error {\n color: var(--color-error);\n }\n\n .info {\n border: 1px solid rgba(100, 100, 100, 0.2);\n background: rgba(10, 10, 10, 0.02);\n }\n\n .tickets .ticket_note_added {\n max-width: 300px;\n }\n\n .tickets .note-summary {\n display: flex;\n flex-direction: row;\n line-height: 0.5;\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 8px 3px;\n }\n\n .tickets .ticket_note_added .description {\n border: 2px solid rgba(100, 100, 100, 0.1);\n background: rgb(255, 249, 194);\n padding: var(--event-padding);\n border-radius: 8px;\n }\n\n .channel_event {\n fill: rgb(230, 230, 230);\n }\n\n .airtime_transferred,\n .flow_exited,\n .flow_entered,\n .ticket_opened,\n .ticket_reopened,\n .ticket_closed,\n .call_started,\n .campaign_fired {\n fill: rgba(223, 65, 159, 1);\n }\n\n .active-ticket.ticket_opened {\n padding: 0em 1em;\n }\n\n .ticket_opened temba-icon.clickable[name='check'] {\n fill: rgba(100, 100, 100, 1);\n }\n\n .ticket_opened .active {\n color: var(--color-text);\n }\n\n .ticket_closed .inactive .subtext {\n display: none;\n }\n\n .attn {\n color: var(--color-text);\n }\n\n .flow_exited,\n .flow_entered {\n align-self: center;\n max-width: 80%;\n display: flex;\n flex-direction: row;\n }\n\n .flow_exited temba-icon,\n .flow_entered temba-icon {\n margin-top: 5px;\n }\n\n .event {\n display: flex;\n align-items: center;\n }\n\n .event .description {\n flex-grow: 1;\n }\n\n .msg-summary {\n display: flex;\n line-height: 0.5;\n\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 6px 3px;\n }\n\n .msg-summary temba-icon[name='log'] {\n --icon-color: rgba(0, 0, 0, 0.2);\n }\n\n .msg-summary temba-icon[name='log']:hover {\n --icon-color: var(--color-link-primary-hover);\n cursor: pointer;\n }\n\n .msg-summary temba-icon.error[name='log'] {\n --icon-color: rgba(var(--error-rgb), 0.75);\n }\n\n .msg-summary temba-icon.error[name='log']:hover {\n --icon-color: var(--color-error);\n cursor: pointer;\n }\n\n .msg-summary temba-icon[name='megaphone'] {\n --icon-color: rgba(90, 90, 90, 0.5);\n }\n\n .msg-summary * {\n display: flex;\n margin-right: 1px;\n margin-left: 1px;\n }\n\n .unsupported {\n border: 1px solid #f2f2f2;\n color: #999;\n padding: 0.5em 1em;\n border-radius: var(--curvature);\n }\n\n .time {\n padding: 0.3em 1px;\n }\n\n .status {\n padding: 0.3em 3px;\n }\n\n .separator {\n padding: 0.3em 0px;\n }\n\n .recipients {\n padding: 0.3em 3px;\n }\n\n .verbose temba-icon,\n .flows temba-icon,\n .tickets temba-icon {\n margin-right: 0.75em;\n }\n\n temba-icon[name='check'] {\n margin-top: 3px;\n }\n\n .attn {\n display: inline-block;\n font-weight: 500;\n margin: 0px 2px;\n }\n\n .subtext {\n font-size: 80%;\n }\n\n .body-pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n font-size: 90%;\n }\n\n a {\n color: var(--color-link-primary);\n }\n\n a:hover {\n text-decoration: underline;\n color: var(--color-link-primary-hover);\n }\n\n temba-icon[name='alert-triangle'] {\n --icon-color: var(--color-error);\n }\n\n .flow {\n fill: #ddd;\n background: #fff;\n width: 18px;\n height: 18px;\n padding-top: 4px;\n padding-left: 9px;\n border: 0px solid #f3f3f3;\n }\n\n .assigned {\n color: #777;\n max-width: 300px;\n margin-left: auto;\n margin-right: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 10px;\n }\n\n .assigned .attn {\n color: #777;\n }\n `;\n};\n\nconst FLOW_USER_ID = -1;\n\nexport interface EventGroup {\n type: string;\n events: ContactEvent[];\n open: boolean;\n closing: boolean;\n}\n\nexport enum Events {\n MESSAGE_CREATED = 'msg_created',\n MESSAGE_RECEIVED = 'msg_received',\n BROADCAST_CREATED = 'broadcast_created',\n IVR_CREATED = 'ivr_created',\n FLOW_ENTERED = 'flow_entered',\n FLOW_EXITED = 'flow_exited',\n RUN_RESULT_CHANGED = 'run_result_changed',\n CONTACT_FIELD_CHANGED = 'contact_field_changed',\n CONTACT_GROUPS_CHANGED = 'contact_groups_changed',\n CONTACT_NAME_CHANGED = 'contact_name_changed',\n CONTACT_URNS_CHANGED = 'contact_urns_changed',\n CAMPAIGN_FIRED = 'campaign_fired',\n CHANNEL_EVENT = 'channel_event',\n CONTACT_LANGUAGE_CHANGED = 'contact_language_changed',\n WEBHOOK_CALLED = 'webhook_called',\n AIRTIME_TRANSFERRED = 'airtime_transferred',\n CALL_STARTED = 'call_started',\n EMAIL_SENT = 'email_sent',\n INPUT_LABELS_ADDED = 'input_labels_added',\n NOTE_CREATED = 'note_created',\n TICKET_ASSIGNED = 'ticket_assigned',\n TICKET_NOTE_ADDED = 'ticket_note_added',\n TICKET_CLOSED = 'ticket_closed',\n TICKET_OPENED = 'ticket_opened',\n TICKET_REOPENED = 'ticket_reopened',\n ERROR = 'error',\n FAILURE = 'failure',\n}\n\nexport interface ContactEvent {\n type: string;\n created_on: string;\n}\n\nexport interface ChannelEvent extends ContactEvent {\n channel_event_type: string;\n duration: number;\n}\n\nexport interface ContactLanguageChangedEvent extends ContactEvent {\n language: string;\n step_uuid: string;\n session_uuid: string;\n}\n\nexport interface MsgEvent extends ContactEvent {\n msg: Msg;\n status: string;\n logs_url: string;\n msg_type: string;\n recipient_count?: number;\n created_by?: User;\n}\n\nexport interface FlowEvent extends ContactEvent {\n flow: ObjectReference;\n status: string;\n}\n\nexport interface EmailSentEvent extends ContactEvent {\n to: string[];\n subject: string;\n body: string;\n}\n\nexport interface URNsChangedEvent extends ContactEvent {\n urns: string[];\n}\n\nexport interface TicketEvent extends ContactEvent {\n note?: string;\n assignee?: User;\n ticket: {\n uuid: string;\n ticketer: ObjectReference;\n body: string;\n topic?: ObjectReference;\n external_id?: string;\n closed_on?: string;\n opened_on?: string;\n };\n created_by?: User;\n}\n\nexport interface LabelsAddedEvent extends ContactEvent {\n labels: ObjectReference[];\n}\n\nexport interface NameChangedEvent extends ContactEvent {\n name: string;\n}\n\nexport interface UpdateFieldEvent extends ContactEvent {\n field: { key: string; name: string };\n value: { text: string };\n}\n\nexport interface ErrorMessageEvent extends ContactEvent {\n text: string;\n}\n\nexport interface UpdateResultEvent extends ContactEvent {\n name: string;\n value: string;\n category: string;\n input: string;\n}\n\nexport interface ContactGroupsEvent extends ContactEvent {\n groups_added: ObjectReference[];\n groups_removed: ObjectReference[];\n}\n\nexport interface WebhookEvent extends ContactEvent {\n status: string;\n status_code: number;\n elapsed_ms: number;\n logs_url: string;\n url: string;\n}\n\nexport interface AirtimeTransferredEvent extends ContactEvent {\n sender: string;\n recipient: string;\n currency: string;\n desired_amount: string;\n actual_amount: string;\n logs_url: string;\n}\n\nexport type CallStartedEvent = ContactEvent;\nexport interface CampaignFiredEvent extends ContactEvent {\n campaign: { id: number; name: string };\n campaign_event: {\n id: number;\n offset_display: string;\n relative_to: { key: string; name: string };\n };\n fired_result: string;\n}\n\nexport interface ContactHistoryPage {\n has_older: boolean;\n recent_only: boolean;\n next_before: number;\n next_after: number;\n start_date: Date;\n events: ContactEvent[];\n}\n\nexport const getEventGroupType = (event: ContactEvent, ticket: string) => {\n if (!event) {\n return 'messages';\n }\n switch (event.type) {\n case Events.TICKET_ASSIGNED:\n case Events.TICKET_NOTE_ADDED:\n case Events.TICKET_OPENED:\n case Events.TICKET_CLOSED:\n case Events.TICKET_REOPENED:\n if (!ticket) {\n return 'verbose';\n }\n\n if ((event as TicketEvent).ticket.uuid === ticket) {\n return 'tickets';\n }\n\n break;\n case Events.FLOW_ENTERED:\n case Events.FLOW_EXITED:\n return 'flows';\n case Events.BROADCAST_CREATED:\n case Events.MESSAGE_CREATED:\n case Events.MESSAGE_RECEIVED:\n case Events.IVR_CREATED:\n return 'messages';\n }\n return 'verbose';\n};\n\nexport const renderAvatar = (user: User, agent = -1) => {\n const current = user && user.id === agent;\n if (user.id === FLOW_USER_ID || !user || !user.first_name) {\n return html`<temba-tip text=\"Automated message\" position=\"top\"\n ><div class=\"avatar flow\" style=\"margin-top:0.5em\">\n <temba-icon size=\"1\" name=\"activity\" /></div\n ></temba-tip>`;\n } else {\n return html`<temba-tip\n text=\"${user.first_name + ' ' + user.last_name}\"\n position=\"top\"\n >\n <div\n class=\"avatar\"\n style=\"\n border-radius: 9999px; \n display:flex;\n align-items:center;\n border: 2px solid rgba(0,0,0,.05);\n background: ${current ? 'var(--color-primary-dark)' : '#eee'};\n color: ${current ? '#fff' : '#999'} ;\n font-weight: 400;\n padding: 0.5em;\n line-height:1.2em;\n \"\n >\n ${user.first_name[0] + user.last_name[0]}\n </div>\n </temba-tip>`;\n }\n};\n\nexport const renderAttachment = (attachment: string): TemplateResult => {\n const idx = attachment.indexOf(':');\n const attType = attachment.substr(0, idx);\n const url = attachment.substr(idx + 1);\n const [mediaType, ext] = attType.split('/', 2);\n\n let inner = null;\n if (mediaType === 'image') {\n inner = html`<a href=\"${url}\"><img src=\"${url}\" style=\"width:100%;height:auto;display:block\"></img></a>`;\n } else if (ext === 'pdf') {\n return html`<div\n style=\"width:100%;height:300px;border-radius:var(--curvature);box-shadow:0px 0px 10px -1px rgb(160 160 160);overflow:hidden\"\n ><embed src=\"${url}#view=Fit\" type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"100%\" width=\"100%\"></embed></div>`;\n } else if (mediaType === 'video') {\n return html`<video max-width=\"400px\" height=\"auto\" controls=\"controls\">\n <source src=\"${url}\" type=\"video/mp4\" />\n </video> `;\n } else {\n return html`<div style=\"display:flex\">\n <temba-icon name=\"download\"></temba-icon>\n <div>Attachment ${ext}</div>\n </div>`;\n }\n\n return html`<div\n style=\"width:100%;max-width:300px;border-radius:var(--curvature); box-shadow:0px 0px 10px -1px rgb(160 160 160);overflow:hidden\"\n >\n ${inner}\n </div>`;\n};\n\nexport const renderMsgEvent = (\n event: MsgEvent,\n agent: number\n): TemplateResult => {\n const isInbound = event.type === Events.MESSAGE_RECEIVED;\n const isError = event.status === 'E' || event.status === 'F';\n const msg = html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n ${event.msg.text ? html`<div class=\"msg\">${event.msg.text}</div>` : null}\n ${event.msg.attachments\n ? html`<div class=\"attachments\">\n ${event.msg.attachments.map(attachment =>\n renderAttachment(attachment)\n )}\n </div> `\n : null}\n ${!event.msg.text && !event.msg.attachments\n ? html`<div class=\"unsupported\">Unsupported Message</div>`\n : null}\n <div\n class=\"msg-summary\"\n style=\"flex-direction:row${isInbound ? '-reverse' : ''}\"\n >\n <div style=\"flex-grow:1\"></div>\n ${event.logs_url\n ? html`\n <a class=\"icon-link\" target=\"_logs\" href=\"${event.logs_url}\">\n <temba-icon\n name=\"log\"\n class=\"${isError ? 'error' : ''}\"\n ></temba-icon\n ></a>\n `\n : isError\n ? html`<temba-icon\n title=\"Message delivery error\"\n name=\"alert-triangle\"\n ></temba-icon>`\n : null}\n ${event.recipient_count > 1\n ? html`<temba-icon size=\"1\" name=\"megaphone\"></temba-icon>\n <div class=\"recipients\">${event.recipient_count} contacts</div>\n <div class=\"separator\">•</div>`\n : null}\n <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\n </div>\n </div>\n\n ${!isInbound\n ? html`<div style=\"margin-left:0.8em;margin-top:0.3em\">\n ${event.msg.created_by\n ? html`<div style=\"font-size:0.8em\">\n ${renderAvatar(event.msg.created_by, agent)}\n </div>`\n : renderAvatar({ id: FLOW_USER_ID })}\n </div>`\n : null}\n </div>`;\n return msg;\n};\n\nexport const renderFlowEvent = (event: FlowEvent): TemplateResult => {\n let verb = 'Interrupted';\n let icon = 'x-octagon';\n\n if (event.status !== 'I') {\n if (event.type === Events.FLOW_ENTERED) {\n verb = 'Started';\n icon = 'flow';\n } else {\n verb = 'Completed';\n icon = 'flow';\n }\n }\n\n return html`\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${verb}\n <a target=\"_\" href=\"/flow/editor/${event.flow.uuid}/\"\n >${event.flow.name}</a\n >\n </div>\n `;\n};\n\nexport const renderResultEvent = (event: UpdateResultEvent): TemplateResult => {\n if (event.name.startsWith('_')) {\n return null;\n }\n return html`\n <temba-icon name=\"flow\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">${event.name}</div>\n to\n <div class=\"attn\">${event.value}</div>\n ${event.category\n ? html`with category\n <div class=\"attn\">${event.category}</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderUpdateEvent = (event: UpdateFieldEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n ${event.value\n ? html`Updated\n <div class=\"attn\">${event.field.name}</div>\n to\n <div class=\"attn\">${event.value.text}</div>`\n : html`Cleared\n <div class=\"attn\">${event.field.name}</div>`}\n </div>\n `;\n};\n\nexport const renderNameChanged = (event: NameChangedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">Name</div>\n to\n <div class=\"attn\">${event.name}</div>\n </div>\n `;\n};\n\nexport const renderContactURNsChanged = (\n event: URNsChangedEvent\n): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">URNs</div>\n to\n ${oxfordFn(\n event.urns,\n (urn: string) =>\n html`<div class=\"attn\">${urn.split(':')[1].split('?')[0]}</div>`\n )}\n </div>\n </div>\n `;\n};\n\nexport const renderEmailSent = (event: EmailSentEvent): TemplateResult => {\n return html`\n <temba-icon name=\"mail\"></temba-icon>\n <div class=\"description\">\n Email sent to\n <div class=\"attn\">${oxford(event.to, 'and')}</div>\n with subject\n <div class=\"attn\">${event.subject}</div>\n </div>\n `;\n};\n\nexport const renderLabelsAdded = (event: LabelsAddedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"tag\"></temba-icon>\n <div class=\"description\">\n Message labeled with\n <div class=\"attn\">${oxfordNamed(event.labels, 'and')}</div>\n </div>\n `;\n};\n\nexport const renderNoteCreated = (\n event: TicketEvent,\n agent: number\n): TemplateResult => {\n return html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n <div class=\"description\">${event.note}</div>\n <div class=\"note-summary\">\n <div style=\"flex-grow:1\"></div>\n <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\n </div>\n </div>\n <div style=\"margin-left:0.8em;margin-top:0.3em;font-size:0.8em\">\n ${renderAvatar(event.created_by, agent)}\n </div>\n </div>`;\n};\n\nconst getTicketIcon = (event: TicketEvent) => {\n let icon = 'inbox';\n if (event.ticket.ticketer.name.indexOf('Email') > -1) {\n icon = 'mail';\n } else if (event.ticket.ticketer.name.indexOf('Zendesk') > -1) {\n icon = 'zendesk';\n }\n return icon;\n};\n\nexport const renderTicketAction = (\n event: TicketEvent,\n action: string,\n grouped: boolean\n): TemplateResult => {\n const reopened = new Date(event.created_on);\n const icon = getTicketIcon(event);\n if (grouped) {\n return html`<div class=\"\" style=\"display: flex\">\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${getDisplayName(event.created_by)} ${action} a\n <a href=\"/tickets/all/open/${event.ticket.uuid}\">ticket</a>\n </div>\n </div>`;\n }\n\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${getDisplayName(event.created_by)} ${action} this ticket\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(reopened, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketAssigned = (event: TicketEvent): TemplateResult => {\n const created = new Date(event.created_on);\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${event.assignee\n ? event.assignee.id === event.created_by.id\n ? html`${getDisplayName(event.created_by)} took this ticket`\n : html`${getDisplayName(event.created_by)} assigned this ticket to\n <div class=\"attn\">${getDisplayName(event.assignee)}</div>`\n : html`${getDisplayName(event.created_by)} unassigned this ticket`}\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(created, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketOpened = (\n event: TicketEvent,\n handleClose: (uuid: string) => void,\n grouped: boolean\n): TemplateResult => {\n const icon = getTicketIcon(event);\n\n if (grouped) {\n return html`<div class=\"\" style=\"display: flex\">\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${event.ticket.topic.name}\n <a href=\"/tickets/all/open/${event.ticket.uuid}\">ticket</a> was opened\n </div>\n </div>`;\n } else {\n return html`\n <temba-icon size=\"1.5\" name=\"${icon}\"></temba-icon>\n\n <div class=\"active\" style=\"flex-grow:1;\">\n Opened\n <div class=\"attn\">\n ${event.ticket.topic ? event.ticket.topic.name : 'General'}\n </div>\n <div class=\"subtext\">${timeSince(new Date(event.created_on))}</div>\n </div>\n ${handleClose\n ? html`\n <temba-tip text=\"Resolve\" position=\"left\" style=\"width:1.5em\">\n <temba-icon\n class=\"clickable\"\n size=\"1.5\"\n name=\"check\"\n @click=${() => {\n handleClose(event.ticket.uuid);\n }}\n ?clickable=${open}\n />\n </temba-tip>\n `\n : null}\n `;\n }\n};\n\nexport const renderErrorMessage = (\n event: ErrorMessageEvent\n): TemplateResult => {\n return html`\n <temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description\">\n ${event.text}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderWebhookEvent = (event: WebhookEvent): TemplateResult => {\n return html`\n <div\n class=\"${event.status === 'success' ? '' : 'failed'}\"\n style=\"display: flex\"\n >\n <temba-icon name=\"external-link\"></temba-icon>\n <div class=\"description\">\n ${event.status === 'success'\n ? html`Successfully called ${event.url}`\n : html`Failed to call ${event.url}`}\n </div>\n </div>\n `;\n};\n\nexport const renderAirtimeTransferredEvent = (\n event: AirtimeTransferredEvent\n): TemplateResult => {\n if (parseFloat(event.actual_amount) === 0) {\n return html`<temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description error\">Airtime transfer failed</div>`;\n }\n\n return html`<temba-icon name=\"dollar-sign\"></temba-icon>\n <div class=\"description\">\n Transferred\n <div class=\"attn\">${event.actual_amount} ${event.currency}</div>\n of airtime\n </div>`;\n};\n\nexport const renderCallStartedEvent = (): TemplateResult => {\n return html`<temba-icon name=\"phone\"></temba-icon>\n <div class=\"description\">Call Started</div>`;\n};\n\nexport const renderContactLanguageChangedEvent = (\n event: ContactLanguageChangedEvent\n): TemplateResult => {\n return html`<temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">Language updated to ${event.language}</div>`;\n};\n\nexport const renderChannelEvent = (event: ChannelEvent): TemplateResult => {\n let eventMessage = '';\n let icon = 'phone';\n\n if (event.channel_event_type === 'mt_miss') {\n eventMessage = 'Missed outgoing call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'mo_miss') {\n eventMessage = 'Missed incoming call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'new_conversation') {\n eventMessage = 'Started Conversation';\n icon = 'zap';\n } else if (event.channel_event_type === 'welcome_message') {\n eventMessage = 'Welcome Message Sent';\n icon = 'zap';\n } else if (event.channel_event_type === 'referral') {\n eventMessage = 'Referred';\n icon = 'zap';\n } else if (event.channel_event_type === 'follow') {\n eventMessage = 'Followed';\n icon = 'zap';\n } else if (event.channel_event_type === 'stop_contact') {\n eventMessage = 'Stopped';\n icon = 'x-octagon';\n } else if (event.channel_event_type === 'mt_call') {\n eventMessage = 'Outgoing Phone Call';\n } else if (event.channel_event_type == 'mo_call') {\n eventMessage = 'Incoming Phone call';\n }\n\n return html`<temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">${eventMessage}</div>`;\n};\n\nexport const renderCampaignFiredEvent = (\n event: CampaignFiredEvent\n): TemplateResult => {\n return html`<temba-icon name=\"campaign\"></temba-icon>\n <div class=\"description\">\n Campaign\n <a href=\"/campaign/read/${event.campaign.id}\" target=\"_\"\n >${event.campaign.name}</a\n >\n ${event.fired_result === 'S' ? 'skipped' : 'triggered'}\n <a href=\"/campaignevent/read/${event.campaign_event.id}\" target=\"_\">\n ${event.campaign_event.offset_display}\n ${event.campaign_event.relative_to.name}</a\n >\n </div>`;\n};\n\nexport const renderContactGroupsEvent = (\n event: ContactGroupsEvent\n): TemplateResult => {\n const groups = event.groups_added || event.groups_removed;\n const added = !!event.groups_added;\n return html`\n <temba-icon\n name=\"users\"\n class=\"${getClasses({ added: added, removed: !added })}\"\n ></temba-icon>\n <div class=\"description\">\n ${added ? 'Added to' : 'Removed from'}\n ${oxfordFn(\n groups,\n (group: ObjectReference) =>\n html`<a target=\"_\" href=\"/contact/filter/${group.uuid}\"\n >${group.name}</a\n >`\n )}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../src/interfaces.ts"],"names":[],"mappings":"AAkKA,MAAM,CAAN,IAAY,eAaX;AAbD,WAAY,eAAe;IACzB,0CAAuB,CAAA;IACvB,8CAA2B,CAAA;IAC3B,yDAAsC,CAAA;IACtC,gDAA6B,CAAA;IAC7B,gDAA6B,CAAA;IAC7B,yDAAsC,CAAA;IACtC,uDAAoC,CAAA;IACpC,6DAA0C,CAAA;IAC1C,2DAAwC,CAAA;IACxC,2DAAwC,CAAA;IACxC,gDAA6B,CAAA;IAC7B,kDAA+B,CAAA;AACjC,CAAC,EAbW,eAAe,KAAf,eAAe,QAa1B","sourcesContent":["export interface User {\n id: number;\n first_name?: string;\n last_name?: string;\n email?: string;\n role?: string;\n created_on?: string;\n}\n\nexport interface Ticket {\n uuid: string;\n subject: string;\n body?: string;\n closed_on: string;\n opened_on: string;\n status: string;\n contact: ObjectReference;\n ticketer: ObjectReference;\n assignee?: User;\n}\n\nexport interface Msg {\n text: string;\n status: string;\n channel: ObjectReference;\n quick_replies: string[];\n urn: string;\n id: number;\n direction: string;\n type: string;\n created_by?: User;\n}\n\nexport interface ObjectReference {\n uuid: string;\n name: string;\n}\n\nexport interface ContactField {\n key: string;\n label: string;\n value_type: string;\n pinned: boolean;\n}\n\nexport interface ContactGroup {\n uuid: string;\n count: number;\n name: string;\n query?: string;\n status: string;\n}\n\nexport interface URN {\n scheme: string;\n path: string;\n}\n\nexport interface Group {\n name: string;\n uuid: string;\n is_dynamic?: boolean;\n}\n\nexport interface ContactTicket {\n name: string;\n uuid: string;\n status: string;\n\n contact: {\n uuid: string;\n name: string;\n created_on: Date;\n last_seen_on: Date;\n };\n}\n\nexport interface Contact {\n name: string;\n uuid: string;\n stopped: boolean;\n blocked: boolean;\n urns: string[];\n lang: string;\n fields: { [key: string]: string };\n groups: Group[];\n modified_on: string;\n created_on: string;\n last_seen_on: string;\n\n last_msg?: Msg;\n direction?: string;\n ticket: {\n uuid: string;\n subject: string;\n closed_on?: string;\n last_activity_on: string;\n assignee?: User;\n };\n}\n\nexport interface FeatureProperties {\n name: string;\n osm_id: string;\n level: number;\n children?: FeatureProperties[];\n has_children?: boolean;\n aliases?: string;\n parent_osm_id?: string;\n id?: number;\n path?: string;\n}\n\nexport interface Position {\n top: number;\n left: number;\n}\n\nexport interface FunctionExample {\n template: string;\n output: string;\n}\n\nexport interface CompletionOption {\n name?: string;\n summary: string;\n\n // functions\n signature?: string;\n detail?: string;\n examples?: FunctionExample[];\n}\n\nexport interface CompletionResult {\n anchorPosition: Position;\n query: string;\n options: CompletionOption[];\n currentFunction: CompletionOption;\n}\n\nexport interface CompletionProperty {\n key: string;\n help: string;\n type: string;\n}\n\nexport interface CompletionType {\n name: string;\n\n key_source?: string;\n property_template?: CompletionProperty;\n properties?: CompletionProperty[];\n}\n\nexport interface CompletionSchema {\n types: CompletionType[];\n root: CompletionProperty[];\n root_no_session: CompletionProperty[];\n}\n\nexport type KeyedAssets = { [assetType: string]: string[] };\n\nexport enum CustomEventType {\n Loaded = 'temba-loaded',\n Canceled = 'temba-canceled',\n CursorChanged = 'temba-cursor-changed',\n Refreshed = 'temba-refreshed',\n Selection = 'temba-selection',\n ButtonClicked = 'temba-button-clicked',\n DialogHidden = 'temba-dialog-hidden',\n ScrollThreshold = 'temba-scroll-threshold',\n ContentChanged = 'temba-content-changed',\n ContextChanged = 'temba-context-changed',\n Submitted = 'temba-submitted',\n Redirected = 'temba-redirected',\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../src/interfaces.ts"],"names":[],"mappings":"AAqKA,MAAM,CAAN,IAAY,eAaX;AAbD,WAAY,eAAe;IACzB,0CAAuB,CAAA;IACvB,8CAA2B,CAAA;IAC3B,yDAAsC,CAAA;IACtC,gDAA6B,CAAA;IAC7B,gDAA6B,CAAA;IAC7B,yDAAsC,CAAA;IACtC,uDAAoC,CAAA;IACpC,6DAA0C,CAAA;IAC1C,2DAAwC,CAAA;IACxC,2DAAwC,CAAA;IACxC,gDAA6B,CAAA;IAC7B,kDAA+B,CAAA;AACjC,CAAC,EAbW,eAAe,KAAf,eAAe,QAa1B","sourcesContent":["export interface User {\n id: number;\n first_name?: string;\n last_name?: string;\n email?: string;\n role?: string;\n created_on?: string;\n}\n\nexport interface Ticket {\n uuid: string;\n subject: string;\n body?: string;\n closed_on: string;\n opened_on: string;\n status: string;\n contact: ObjectReference;\n ticketer: ObjectReference;\n topic: ObjectReference;\n assignee?: User;\n}\n\nexport interface Msg {\n text: string;\n status: string;\n channel: ObjectReference;\n quick_replies: string[];\n urn: string;\n id: number;\n direction: string;\n type: string;\n created_by?: User;\n attachments: string[];\n}\n\nexport interface ObjectReference {\n uuid: string;\n name: string;\n}\n\nexport interface ContactField {\n key: string;\n label: string;\n value_type: string;\n pinned: boolean;\n}\n\nexport interface ContactGroup {\n uuid: string;\n count: number;\n name: string;\n query?: string;\n status: string;\n}\n\nexport interface URN {\n scheme: string;\n path: string;\n}\n\nexport interface Group {\n name: string;\n uuid: string;\n is_dynamic?: boolean;\n}\n\nexport interface ContactTicket {\n name: string;\n uuid: string;\n status: string;\n\n contact: {\n uuid: string;\n name: string;\n created_on: Date;\n last_seen_on: Date;\n };\n}\n\nexport interface Contact {\n name: string;\n uuid: string;\n stopped: boolean;\n blocked: boolean;\n urns: string[];\n lang: string;\n fields: { [key: string]: string };\n groups: Group[];\n modified_on: string;\n created_on: string;\n last_seen_on: string;\n\n last_msg?: Msg;\n direction?: string;\n ticket: {\n uuid: string;\n subject: string;\n closed_on?: string;\n last_activity_on: string;\n assignee?: User;\n topic?: ObjectReference;\n };\n}\n\nexport interface FeatureProperties {\n name: string;\n osm_id: string;\n level: number;\n children?: FeatureProperties[];\n has_children?: boolean;\n aliases?: string;\n parent_osm_id?: string;\n id?: number;\n path?: string;\n}\n\nexport interface Position {\n top: number;\n left: number;\n}\n\nexport interface FunctionExample {\n template: string;\n output: string;\n}\n\nexport interface CompletionOption {\n name?: string;\n summary: string;\n\n // functions\n signature?: string;\n detail?: string;\n examples?: FunctionExample[];\n}\n\nexport interface CompletionResult {\n anchorPosition: Position;\n query: string;\n options: CompletionOption[];\n currentFunction: CompletionOption;\n}\n\nexport interface CompletionProperty {\n key: string;\n help: string;\n type: string;\n}\n\nexport interface CompletionType {\n name: string;\n\n key_source?: string;\n property_template?: CompletionProperty;\n properties?: CompletionProperty[];\n}\n\nexport interface CompletionSchema {\n types: CompletionType[];\n root: CompletionProperty[];\n root_no_session: CompletionProperty[];\n}\n\nexport type KeyedAssets = { [assetType: string]: string[] };\n\nexport enum CustomEventType {\n Loaded = 'temba-loaded',\n Canceled = 'temba-canceled',\n CursorChanged = 'temba-cursor-changed',\n Refreshed = 'temba-refreshed',\n Selection = 'temba-selection',\n ButtonClicked = 'temba-button-clicked',\n DialogHidden = 'temba-dialog-hidden',\n ScrollThreshold = 'temba-scroll-threshold',\n ContentChanged = 'temba-content-changed',\n ContextChanged = 'temba-context-changed',\n Submitted = 'temba-submitted',\n Redirected = 'temba-redirected',\n}\n"]}
@@ -10,39 +10,54 @@ export class ContactList extends TembaList {
10
10
  this.valueKey = 'ticket.uuid';
11
11
  this.renderOption = (contact) => {
12
12
  return html `
13
- <div style="display: flex-col; align-items:center">
14
- <div style="display:flex; align-items: flex-start;">
15
- <div style="flex: 1; color:#333; margin-top: 0.4em">
16
- <div style="font-weight:400">${contact.name}</div>
13
+ <div
14
+ style="display: align-items:center; margin-top: 0.1em; margin-bottom: 0.1em"
15
+ >
16
+ <div
17
+ style="display:flex; align-items: flex-start;border:0px solid red;"
18
+ >
19
+ <div style="flex: 1; color:#333;">
20
+ <div
21
+ style="font-weight:400;line-height:1.6;border:0px solid purple;"
22
+ >
23
+ ${contact.name}
24
+ </div>
17
25
  ${contact.ticket.closed_on
18
- ? html `<div
19
- style="font-size: 0.9em; margin:0.4em 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;"
20
- >
21
- ${contact.ticket.subject}
22
- </div>`
26
+ ? null
23
27
  : contact.last_msg
24
28
  ? html `
25
29
  <div
26
- style="font-size: 0.9em; margin-bottom:0.5em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;"
30
+ style="font-size: 0.9em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;"
27
31
  >
28
32
  ${contact.last_msg.direction === 'I'
29
33
  ? html `<div
30
- style="border-radius:9999px; background:var(--color-primary-dark);width:6px;height:6px;display:inline-block;margin:0px 2px;margin-bottom:1px;"
31
- ></div>`
34
+ style="border-radius:9999px; background:var(--color-primary-dark);width:6px;height:6px;display:inline-block;margin:0px 2px;margin-bottom:1px;"
35
+ ></div>`
32
36
  : null}
33
- ${contact.last_msg.text}
34
- </div>
37
+ ${contact.last_msg.text
38
+ ? contact.last_msg.text
39
+ : contact.last_msg.attachments
40
+ ? html `<div style="display:inline-block">
41
+ <div style="display:flex; margin-left:0.2em">
42
+ <temba-icon name="paperclip"></temba-icon>
43
+ <div style="flex-grow:1;margin-left:0.2em">
44
+ Attachment
45
+ </div>
46
+ </div>
47
+ </div>`
48
+ : 'Unsupported Message'}
49
+ </div></div>
35
50
  `
36
51
  : null}
37
52
  </div>
38
53
  <div
39
- style="font-size:0.8em;display:flex;flex-direction:column;align-items:center;max-width:60px;min-width:30px"
54
+ style="font-size:0.8em;display:flex;flex-direction:column;align-items:flex-end;max-width:60px;min-width:30px;border:0px solid green;text-align:right"
40
55
  >
41
- <div style="text-align:center;padding:4px;padding-bottom:2px;">
56
+ <div style="padding:4px;padding-bottom:2px">
42
57
  ${timeSince(new Date(contact.ticket.closed_on || contact.ticket.last_activity_on))}
43
58
  </div>
44
59
  <div style="font-size:0.7em;">
45
- ${contact.ticket.assignee
60
+ ${!contact.ticket.closed_on && contact.ticket.assignee
46
61
  ? html `${renderAvatar(contact.ticket.assignee, this.agent)}`
47
62
  : null}
48
63
  </div>
@@ -1 +1 @@
1
- {"version":3,"file":"ContactList.js","sourceRoot":"","sources":["../../../src/list/ContactList.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAkB,MAAM,aAAa,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,MAAM,OAAO,WAAY,SAAQ,SAAS;IAYxC;QACE,KAAK,EAAE,CAAC;QAHV,UAAK,GAAG,CAAC,CAAC;QAKR,IAAI,CAAC,QAAQ,GAAG,aAAa,CAAC;QAC9B,IAAI,CAAC,YAAY,GAAG,CAAC,OAAgB,EAAkB,EAAE;YACvD,OAAO,IAAI,CAAA;;;;6CAI4B,OAAO,CAAC,IAAI;gBACzC,OAAO,CAAC,MAAM,CAAC,SAAS;gBACxB,CAAC,CAAC,IAAI,CAAA;;;sBAGA,OAAO,CAAC,MAAM,CAAC,OAAO;yBACnB;gBACT,CAAC,CAAC,OAAO,CAAC,QAAQ;oBAClB,CAAC,CAAC,IAAI,CAAA;;;;wBAIE,OAAO,CAAC,QAAQ,CAAC,SAAS,KAAK,GAAG;wBAClC,CAAC,CAAC,IAAI,CAAA;;kCAEI;wBACV,CAAC,CAAC,IAAI;wBACN,OAAO,CAAC,QAAQ,CAAC,IAAI;;mBAE1B;oBACH,CAAC,CAAC,IAAI;;;;;;kBAMJ,SAAS,CACT,IAAI,IAAI,CACN,OAAO,CAAC,MAAM,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,CAAC,gBAAgB,CAC5D,CACF;;;kBAGC,OAAO,CAAC,MAAM,CAAC,QAAQ;gBACvB,CAAC,CAAC,IAAI,CAAA,GAAG,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE;gBAC5D,CAAC,CAAC,IAAI;;;;;OAKjB,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC;IA9DD,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;KAIT,CAAC;IACJ,CAAC;CAyDF;AAtDC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CACjB","sourcesContent":["import { css, html, property, TemplateResult } from 'lit-element';\nimport { TembaList } from './TembaList';\nimport { timeSince } from '../utils';\nimport { Contact } from '../interfaces';\nimport { renderAvatar } from '../contacts/events';\n\nexport class ContactList extends TembaList {\n static get styles() {\n return css`\n :host {\n width: 100%;\n }\n `;\n }\n\n @property({ type: Number })\n agent = 1;\n\n constructor() {\n super();\n\n this.valueKey = 'ticket.uuid';\n this.renderOption = (contact: Contact): TemplateResult => {\n return html`\n <div style=\"display: flex-col; align-items:center\">\n <div style=\"display:flex;\talign-items: flex-start;\">\n <div style=\"flex: 1; color:#333; margin-top: 0.4em\">\n <div style=\"font-weight:400\">${contact.name}</div>\n ${contact.ticket.closed_on\n ? html`<div\n style=\"font-size: 0.9em; margin:0.4em 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;\"\n >\n ${contact.ticket.subject}\n </div>`\n : contact.last_msg\n ? html`\n <div\n style=\"font-size: 0.9em; margin-bottom:0.5em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;\"\n >\n ${contact.last_msg.direction === 'I'\n ? html`<div\n style=\"border-radius:9999px; background:var(--color-primary-dark);width:6px;height:6px;display:inline-block;margin:0px 2px;margin-bottom:1px;\"\n ></div>`\n : null}\n ${contact.last_msg.text}\n </div>\n `\n : null}\n </div>\n <div\n style=\"font-size:0.8em;display:flex;flex-direction:column;align-items:center;max-width:60px;min-width:30px\"\n >\n <div style=\"text-align:center;padding:4px;padding-bottom:2px;\">\n ${timeSince(\n new Date(\n contact.ticket.closed_on || contact.ticket.last_activity_on\n )\n )}\n </div>\n <div style=\"font-size:0.7em;\">\n ${contact.ticket.assignee\n ? html`${renderAvatar(contact.ticket.assignee, this.agent)}`\n : null}\n </div>\n </div>\n </div>\n </div>\n `;\n };\n }\n}\n"]}
1
+ {"version":3,"file":"ContactList.js","sourceRoot":"","sources":["../../../src/list/ContactList.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAkB,MAAM,aAAa,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,MAAM,OAAO,WAAY,SAAQ,SAAS;IAYxC;QACE,KAAK,EAAE,CAAC;QAHV,UAAK,GAAG,CAAC,CAAC;QAKR,IAAI,CAAC,QAAQ,GAAG,aAAa,CAAC;QAC9B,IAAI,CAAC,YAAY,GAAG,CAAC,OAAgB,EAAkB,EAAE;YACvD,OAAO,IAAI,CAAA;;;;;;;;;;;kBAWC,OAAO,CAAC,IAAI;;gBAEd,OAAO,CAAC,MAAM,CAAC,SAAS;gBACxB,CAAC,CAAC,IAAI;gBACN,CAAC,CAAC,OAAO,CAAC,QAAQ;oBAClB,CAAC,CAAC,IAAI,CAAA;;;;wBAKE,OAAO,CAAC,QAAQ,CAAC,SAAS,KAAK,GAAG;wBAChC,CAAC,CAAC,IAAI,CAAA;;oCAEI;wBACV,CAAC,CAAC,IACN;wBAEE,OAAO,CAAC,QAAQ,CAAC,IAAI;wBACnB,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI;wBACvB,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,WAAW;4BAC9B,CAAC,CAAC,IAAI,CAAA;;;;;;;mCAOG;4BACT,CAAC,CAAC,qBACN;;mBAEH;oBACH,CAAC,CAAC,IAAI;;;;;;kBAMJ,SAAS,CACT,IAAI,IAAI,CACN,OAAO,CAAC,MAAM,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,CAAC,gBAAgB,CAC5D,CACF;;;kBAGC,CAAC,OAAO,CAAC,MAAM,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,CAAC,QAAQ;gBACpD,CAAC,CAAC,IAAI,CAAA,GAAG,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE;gBAC5D,CAAC,CAAC,IAAI;;;;;OAKjB,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC;IAjFD,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;KAIT,CAAC;IACJ,CAAC;CA4EF;AAzEC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CACjB","sourcesContent":["import { css, html, property, TemplateResult } from 'lit-element';\nimport { TembaList } from './TembaList';\nimport { timeSince } from '../utils';\nimport { Contact } from '../interfaces';\nimport { renderAvatar } from '../contacts/events';\n\nexport class ContactList extends TembaList {\n static get styles() {\n return css`\n :host {\n width: 100%;\n }\n `;\n }\n\n @property({ type: Number })\n agent = 1;\n\n constructor() {\n super();\n\n this.valueKey = 'ticket.uuid';\n this.renderOption = (contact: Contact): TemplateResult => {\n return html`\n <div\n style=\"display: align-items:center; margin-top: 0.1em; margin-bottom: 0.1em\"\n >\n <div\n style=\"display:flex; align-items: flex-start;border:0px solid red;\"\n >\n <div style=\"flex: 1; color:#333;\">\n <div\n style=\"font-weight:400;line-height:1.6;border:0px solid purple;\"\n >\n ${contact.name}\n </div>\n ${contact.ticket.closed_on\n ? null\n : contact.last_msg\n ? html`\n <div\n style=\"font-size: 0.9em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;\"\n >\n ${\n contact.last_msg.direction === 'I'\n ? html`<div\n style=\"border-radius:9999px; background:var(--color-primary-dark);width:6px;height:6px;display:inline-block;margin:0px 2px;margin-bottom:1px;\"\n ></div>`\n : null\n }\n ${\n contact.last_msg.text\n ? contact.last_msg.text\n : contact.last_msg.attachments\n ? html`<div style=\"display:inline-block\">\n <div style=\"display:flex; margin-left:0.2em\">\n <temba-icon name=\"paperclip\"></temba-icon>\n <div style=\"flex-grow:1;margin-left:0.2em\">\n Attachment\n </div>\n </div>\n </div>`\n : 'Unsupported Message'\n }\n </div></div>\n `\n : null}\n </div>\n <div\n style=\"font-size:0.8em;display:flex;flex-direction:column;align-items:flex-end;max-width:60px;min-width:30px;border:0px solid green;text-align:right\"\n >\n <div style=\"padding:4px;padding-bottom:2px\">\n ${timeSince(\n new Date(\n contact.ticket.closed_on || contact.ticket.last_activity_on\n )\n )}\n </div>\n <div style=\"font-size:0.7em;\">\n ${!contact.ticket.closed_on && contact.ticket.assignee\n ? html`${renderAvatar(contact.ticket.assignee, this.agent)}`\n : null}\n </div>\n </div>\n </div>\n </div>\n `;\n };\n }\n}\n"]}
@@ -19,10 +19,8 @@ export class TembaList extends RapidElement {
19
19
  this.nextPage = null;
20
20
  this.pages = 0;
21
21
  this.pending = [];
22
+ this.refreshInterval = null;
22
23
  this.handleSelection.bind(this);
23
- setInterval(() => {
24
- this.refreshKey = 'default_' + new Date().getTime();
25
- }, DEFAULT_REFRESH);
26
24
  }
27
25
  static get styles() {
28
26
  return css `
@@ -46,6 +44,15 @@ export class TembaList extends RapidElement {
46
44
  this.mostRecentItem = null;
47
45
  this.items = [];
48
46
  }
47
+ connectedCallback() {
48
+ super.connectedCallback();
49
+ this.refreshInterval = setInterval(() => {
50
+ this.refreshKey = 'default_' + new Date().getTime();
51
+ }, DEFAULT_REFRESH);
52
+ }
53
+ disconnectedCallback() {
54
+ clearInterval(this.refreshInterval);
55
+ }
49
56
  updated(changedProperties) {
50
57
  super.updated(changedProperties);
51
58
  if (changedProperties.has('endpoint') && this.endpoint) {
@@ -1 +1 @@
1
- {"version":3,"file":"TembaList.js","sourceRoot":"","sources":["../../../src/list/TembaList.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, TemplateResult } from 'lit-element';\nimport { reset } from 'sinon';\nimport { CustomEventType } from '../interfaces';\nimport { RapidElement } from '../RapidElement';\nimport { fetchResultsPage, ResultsPage } from '../utils';\n\nconst DEFAULT_REFRESH = 10000;\n\nexport class TembaList extends RapidElement {\n @property({ type: Array, attribute: false })\n items: any[] = [];\n\n @property({ type: Object, attribute: false })\n selected: any;\n\n @property({ type: Number })\n cursorIndex = -1;\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: String })\n nextSelection: any;\n\n @property({ type: Number })\n tabIndex = 1;\n\n @property({ type: String })\n valueKey = 'id';\n\n @property({ type: String })\n value: string;\n\n @property({ type: Boolean })\n loading = false;\n\n @property({ type: Boolean })\n collapsed: boolean;\n\n @property({ attribute: false })\n getNextRefresh: (firstOption: any) => any;\n\n @property({ attribute: false })\n sanitizeOption: (option: any) => any;\n\n @property({ attribute: false })\n renderOption: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false })\n renderOptionDetail: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false, type: Object })\n mostRecentItem: any;\n\n // changes to the refresh key force a refresh\n @property({ type: String })\n refreshKey = '0';\n\n // our next page from our endpoint\n nextPage: string = null;\n\n pages = 0;\n clearRefreshTimeout: any;\n pending: AbortController[] = [];\n\n // used for testing only\n preserve: boolean;\n\n // http promise to monitor for completeness\n public httpComplete: Promise<void>;\n\n static get styles() {\n return css`\n :host {\n display: block;\n height: 100%;\n width: 100%;\n }\n\n temba-options {\n display: block;\n height: 100%;\n width: 100%;\n }\n `;\n }\n\n constructor() {\n super();\n this.handleSelection.bind(this);\n\n setInterval(() => {\n this.refreshKey = 'default_' + new Date().getTime();\n }, DEFAULT_REFRESH);\n }\n\n private reset(): void {\n this.selected = null;\n this.nextPage = null;\n this.cursorIndex = -1;\n this.mostRecentItem = null;\n this.items = [];\n }\n\n public updated(changedProperties: Map<string, any>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('endpoint') && this.endpoint) {\n // if our tests aren't preserving our properties, reset\n if (!this.preserve) {\n this.reset();\n this.loading = true;\n }\n\n this.httpComplete = this.fetchItems();\n }\n\n if (\n changedProperties.has('refreshKey') &&\n !changedProperties.has('endpoint')\n ) {\n this.fetchItems();\n }\n\n if (changedProperties.has('mostRecentItem')) {\n this.fireCustomEvent(CustomEventType.Refreshed);\n }\n\n if (changedProperties.has('cursorIndex')) {\n if (this.cursorIndex > -1) {\n this.selected = this.items[this.cursorIndex];\n this.handleSelected(this.selected);\n }\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n public handleSelected(selected: any) {\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n private getValue(obj: any): any {\n if (!obj) {\n return null;\n }\n\n const path = this.valueKey.split('.');\n let current = obj;\n while (path.length > 0) {\n const key = path.shift();\n current = current[key];\n }\n return current;\n }\n\n public setSelection(value: string) {\n const index = this.items.findIndex(item => {\n return this.getValue(item) === value;\n });\n this.cursorIndex = index;\n this.selected = this.items[index];\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n public getSelection(): any {\n return this.selected;\n }\n\n public refresh(): void {\n this.refreshKey = 'requested_' + new Date().getTime();\n }\n\n public setEndpoint(endpoint: string, nextSelection: any = null) {\n this.endpoint = endpoint;\n this.nextSelection = nextSelection;\n }\n\n private async fetchItems(): Promise<void> {\n // cancel any outstanding requests\n while (this.pending.length > 0) {\n const pending = this.pending.pop();\n pending.abort();\n }\n\n let endpoint = this.endpoint;\n let pagesToFetch = this.pages || 1;\n let pages = 0;\n let nextPage = null;\n\n let fetchedItems: any[] = [];\n\n while (pagesToFetch > 0 && endpoint) {\n const controller = new AbortController();\n this.pending.push(controller);\n\n try {\n const page = await fetchResultsPage(endpoint, controller);\n\n // sanitize our options if necessary\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n if (page.results) {\n fetchedItems = fetchedItems.concat(page.results);\n }\n\n // save our next pages\n nextPage = page.next;\n endpoint = nextPage;\n pagesToFetch--;\n pages++;\n } catch (error) {\n // aborted\n reset();\n return;\n }\n\n this.nextPage = nextPage;\n }\n this.pages = pages;\n\n const topItem = fetchedItems[0];\n if (\n !this.mostRecentItem ||\n JSON.stringify(this.mostRecentItem) !== JSON.stringify(topItem)\n ) {\n this.mostRecentItem = topItem;\n }\n\n // see if our cursor needs to move to stay on the same item\n const newItem = fetchedItems[this.cursorIndex];\n\n if (\n !this.nextSelection &&\n this.selected &&\n newItem &&\n this.getValue(newItem) !== this.getValue(this.selected)\n ) {\n const index = fetchedItems.findIndex(item => {\n return this.getValue(item) === this.getValue(this.selected);\n });\n\n // old selection is in the new fetch\n if (index > -1) {\n this.cursorIndex = index;\n }\n // old selection is missing from the new fetch\n else {\n // if our index didn't change, our item still did, fire change\n if (this.cursorIndex === 0) {\n this.requestUpdate('cursorIndex');\n }\n // otherwise select the first item\n else {\n this.cursorIndex = 0;\n }\n }\n }\n\n // save our results\n this.items = fetchedItems;\n this.loading = false;\n this.pending = [];\n\n if (this.nextSelection) {\n this.setSelection(this.nextSelection);\n this.nextSelection = false;\n } else {\n if (this.cursorIndex === -1) {\n this.cursorIndex = 0;\n }\n }\n\n // TODO: Not sure why this is needed\n // this.requestUpdate('cursorIndex');\n\n if (this.value) {\n this.setSelection(this.value);\n this.value = null;\n }\n\n return Promise.resolve();\n }\n\n private handleScrollThreshold() {\n if (this.nextPage) {\n fetchResultsPage(this.nextPage).then((page: ResultsPage) => {\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n this.items = [...this.items, ...page.results];\n this.nextPage = page.next;\n this.pages++;\n });\n }\n }\n\n private handleSelection(event: CustomEvent) {\n const { selected, index } = event.detail;\n\n this.selected = selected;\n this.cursorIndex = index;\n\n event.stopPropagation();\n event.preventDefault();\n }\n\n public render(): TemplateResult {\n return html`<temba-options\n ?visible=${true}\n ?block=${true}\n ?collapsed=${this.collapsed}\n ?loading=${this.loading}\n .renderOption=${this.renderOption}\n .renderOptionDetail=${this.renderOptionDetail}\n @temba-scroll-threshold=${this.handleScrollThreshold}\n @temba-selection=${this.handleSelection.bind(this)}\n .options=${this.items}\n .cursorIndex=${this.cursorIndex}\n >\n <slot></slot>\n </temba-options>`;\n }\n}\n"]}
1
+ {"version":3,"file":"TembaList.js","sourceRoot":"","sources":["../../../src/list/TembaList.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, TemplateResult } from 'lit-element';\nimport { reset } from 'sinon';\nimport { CustomEventType } from '../interfaces';\nimport { RapidElement } from '../RapidElement';\nimport { fetchResultsPage, ResultsPage } from '../utils';\n\nconst DEFAULT_REFRESH = 10000;\n\nexport class TembaList extends RapidElement {\n @property({ type: Array, attribute: false })\n items: any[] = [];\n\n @property({ type: Object, attribute: false })\n selected: any;\n\n @property({ type: Number })\n cursorIndex = -1;\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: String })\n nextSelection: any;\n\n @property({ type: Number })\n tabIndex = 1;\n\n @property({ type: String })\n valueKey = 'id';\n\n @property({ type: String })\n value: string;\n\n @property({ type: Boolean })\n loading = false;\n\n @property({ type: Boolean })\n collapsed: boolean;\n\n @property({ attribute: false })\n getNextRefresh: (firstOption: any) => any;\n\n @property({ attribute: false })\n sanitizeOption: (option: any) => any;\n\n @property({ attribute: false })\n renderOption: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false })\n renderOptionDetail: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false, type: Object })\n mostRecentItem: any;\n\n // changes to the refresh key force a refresh\n @property({ type: String })\n refreshKey = '0';\n\n // our next page from our endpoint\n nextPage: string = null;\n\n pages = 0;\n clearRefreshTimeout: any;\n pending: AbortController[] = [];\n\n // used for testing only\n preserve: boolean;\n\n // http promise to monitor for completeness\n public httpComplete: Promise<void>;\n\n static get styles() {\n return css`\n :host {\n display: block;\n height: 100%;\n width: 100%;\n }\n\n temba-options {\n display: block;\n height: 100%;\n width: 100%;\n }\n `;\n }\n\n constructor() {\n super();\n this.handleSelection.bind(this);\n }\n\n private reset(): void {\n this.selected = null;\n this.nextPage = null;\n this.cursorIndex = -1;\n this.mostRecentItem = null;\n this.items = [];\n }\n\n refreshInterval = null;\n\n public connectedCallback() {\n super.connectedCallback();\n this.refreshInterval = setInterval(() => {\n this.refreshKey = 'default_' + new Date().getTime();\n }, DEFAULT_REFRESH);\n }\n\n public disconnectedCallback() {\n clearInterval(this.refreshInterval);\n }\n\n public updated(changedProperties: Map<string, any>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('endpoint') && this.endpoint) {\n // if our tests aren't preserving our properties, reset\n if (!this.preserve) {\n this.reset();\n this.loading = true;\n }\n\n this.httpComplete = this.fetchItems();\n }\n\n if (\n changedProperties.has('refreshKey') &&\n !changedProperties.has('endpoint')\n ) {\n this.fetchItems();\n }\n\n if (changedProperties.has('mostRecentItem')) {\n this.fireCustomEvent(CustomEventType.Refreshed);\n }\n\n if (changedProperties.has('cursorIndex')) {\n if (this.cursorIndex > -1) {\n this.selected = this.items[this.cursorIndex];\n this.handleSelected(this.selected);\n }\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n public handleSelected(selected: any) {\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n private getValue(obj: any): any {\n if (!obj) {\n return null;\n }\n\n const path = this.valueKey.split('.');\n let current = obj;\n while (path.length > 0) {\n const key = path.shift();\n current = current[key];\n }\n return current;\n }\n\n public setSelection(value: string) {\n const index = this.items.findIndex(item => {\n return this.getValue(item) === value;\n });\n this.cursorIndex = index;\n this.selected = this.items[index];\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n public getSelection(): any {\n return this.selected;\n }\n\n public refresh(): void {\n this.refreshKey = 'requested_' + new Date().getTime();\n }\n\n public setEndpoint(endpoint: string, nextSelection: any = null) {\n this.endpoint = endpoint;\n this.nextSelection = nextSelection;\n }\n\n private async fetchItems(): Promise<void> {\n // cancel any outstanding requests\n while (this.pending.length > 0) {\n const pending = this.pending.pop();\n pending.abort();\n }\n\n let endpoint = this.endpoint;\n let pagesToFetch = this.pages || 1;\n let pages = 0;\n let nextPage = null;\n\n let fetchedItems: any[] = [];\n\n while (pagesToFetch > 0 && endpoint) {\n const controller = new AbortController();\n this.pending.push(controller);\n\n try {\n const page = await fetchResultsPage(endpoint, controller);\n\n // sanitize our options if necessary\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n if (page.results) {\n fetchedItems = fetchedItems.concat(page.results);\n }\n\n // save our next pages\n nextPage = page.next;\n endpoint = nextPage;\n pagesToFetch--;\n pages++;\n } catch (error) {\n // aborted\n reset();\n return;\n }\n\n this.nextPage = nextPage;\n }\n this.pages = pages;\n\n const topItem = fetchedItems[0];\n if (\n !this.mostRecentItem ||\n JSON.stringify(this.mostRecentItem) !== JSON.stringify(topItem)\n ) {\n this.mostRecentItem = topItem;\n }\n\n // see if our cursor needs to move to stay on the same item\n const newItem = fetchedItems[this.cursorIndex];\n\n if (\n !this.nextSelection &&\n this.selected &&\n newItem &&\n this.getValue(newItem) !== this.getValue(this.selected)\n ) {\n const index = fetchedItems.findIndex(item => {\n return this.getValue(item) === this.getValue(this.selected);\n });\n\n // old selection is in the new fetch\n if (index > -1) {\n this.cursorIndex = index;\n }\n // old selection is missing from the new fetch\n else {\n // if our index didn't change, our item still did, fire change\n if (this.cursorIndex === 0) {\n this.requestUpdate('cursorIndex');\n }\n // otherwise select the first item\n else {\n this.cursorIndex = 0;\n }\n }\n }\n\n // save our results\n this.items = fetchedItems;\n this.loading = false;\n this.pending = [];\n\n if (this.nextSelection) {\n this.setSelection(this.nextSelection);\n this.nextSelection = false;\n } else {\n if (this.cursorIndex === -1) {\n this.cursorIndex = 0;\n }\n }\n\n // TODO: Not sure why this is needed\n // this.requestUpdate('cursorIndex');\n\n if (this.value) {\n this.setSelection(this.value);\n this.value = null;\n }\n\n return Promise.resolve();\n }\n\n private handleScrollThreshold() {\n if (this.nextPage) {\n fetchResultsPage(this.nextPage).then((page: ResultsPage) => {\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n this.items = [...this.items, ...page.results];\n this.nextPage = page.next;\n this.pages++;\n });\n }\n }\n\n private handleSelection(event: CustomEvent) {\n const { selected, index } = event.detail;\n\n this.selected = selected;\n this.cursorIndex = index;\n\n event.stopPropagation();\n event.preventDefault();\n }\n\n public render(): TemplateResult {\n return html`<temba-options\n ?visible=${true}\n ?block=${true}\n ?collapsed=${this.collapsed}\n ?loading=${this.loading}\n .renderOption=${this.renderOption}\n .renderOptionDetail=${this.renderOptionDetail}\n @temba-scroll-threshold=${this.handleScrollThreshold}\n @temba-selection=${this.handleSelection.bind(this)}\n .options=${this.items}\n .cursorIndex=${this.cursorIndex}\n >\n <slot></slot>\n </temba-options>`;\n }\n}\n"]}
@@ -290,7 +290,7 @@ export class TembaMenu extends RapidElement {
290
290
  }
291
291
  // eslint-disable-next-line @typescript-eslint/no-empty-function
292
292
  loadItems(item) {
293
- if (item.endpoint) {
293
+ if (item && item.endpoint) {
294
294
  item.loading = true;
295
295
  this.httpComplete = fetchResults(item.endpoint).then((items) => {
296
296
  // update our item level
@@ -413,7 +413,12 @@ export class TembaMenu extends RapidElement {
413
413
  }
414
414
  render() {
415
415
  if (!this.root || !this.root.items) {
416
- return html `<temba-loading />`;
416
+ return html `<temba-loading
417
+ units="3"
418
+ size="10"
419
+ direction="column"
420
+ style="margin:1em;margin-right:0em"
421
+ />`;
417
422
  }
418
423
  let items = this.root.items;
419
424
  const levels = [];
@@ -1 +1 @@
1
- {"version":3,"file":"TembaMenu.js","sourceRoot":"","sources":["../../../src/list/TembaMenu.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, TemplateResult } from 'lit-element';\nimport { RapidElement } from '../RapidElement';\nimport {\n COOKIE_KEYS,\n fetchResults,\n getCookieBoolean,\n setCookie,\n} from '../utils';\n\nexport interface MenuItem {\n id?: string;\n name?: string;\n count?: number;\n icon?: string;\n endpoint?: string;\n loading?: boolean;\n bottom?: boolean;\n level?: number;\n trigger?: string;\n href?: string;\n items?: MenuItem[];\n inline?: boolean;\n}\n\nexport class TembaMenu extends RapidElement {\n static get styles() {\n return css`\n :host {\n width: 100%;\n display: block;\n --color-widget-bg-focused: transparent;\n --options-block-shadow: none;\n }\n\n .section {\n font-size: 1.875rem;\n margin-bottom: 0.2em;\n color: var(--color-text-dark);\n }\n\n .collapse-toggle {\n width: 0.5em;\n cursor: pointer;\n display: block;\n margin-right: 5px;\n margin-top: 3px;\n margin-bottom: 3px;\n }\n\n .collapse-toggle:hover {\n background: rgb(100, 100, 100, 0.05);\n }\n\n .item {\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n display: flex;\n font-size: 1.15em;\n }\n\n .item.selected {\n background: var(--color-selection);\n color: var(--color-primary-dark);\n --icon-color: var(--color-primary-dark);\n }\n\n .root {\n display: flex;\n flex-direction: row;\n height: 100%;\n }\n\n .level {\n display: flex;\n flex-direction: column;\n }\n\n .level.hidden {\n display: none;\n }\n\n .submenu {\n }\n\n .level-0 > .item {\n background: var(--color-primary-dark);\n --icon-color: #fff;\n font-size: 1em;\n }\n\n .level-0 > .top {\n padding-top: var(--menu-padding);\n background: var(--color-primary-dark);\n }\n\n .level-0 > .empty {\n background: var(--color-primary-dark);\n align-self: stretch;\n flex-grow: 1;\n }\n\n .level-0 > .bottom {\n height: 1em;\n background: var(--color-primary-dark);\n }\n\n .level-0 > .item > .name {\n display: none;\n }\n\n .level-0.expanding {\n }\n\n .level-0.expanded {\n background: inherit;\n }\n\n .level-0 > .item.selected {\n background: inherit;\n --icon-color: var(--color-primary-dark);\n }\n\n .level {\n padding: var(--menu-padding);\n }\n\n .level-0 {\n padding: 0px;\n }\n\n .item {\n padding: 0.2em 0.75em;\n margin-top: 0.1em;\n border-radius: var(--curvature);\n }\n\n .item > temba-icon {\n margin-right: 0.5em;\n }\n\n .item > .name {\n min-width: 7em;\n }\n\n .level-0 > .item {\n padding: 1em 1em;\n margin-top: 0em;\n border-radius: 0px;\n }\n\n .level-0 > .item > temba-icon {\n margin-right: 0px;\n }\n\n .level-0 > .item > .name {\n min-width: 0px;\n }\n\n .count {\n align-self: center;\n margin-left: var(--menu-padding);\n font-size: 0.8em;\n font-weight: 400;\n }\n\n .level-0 > .item-top {\n background: var(--color-primary-dark);\n min-height: var(--curvature);\n }\n\n .level-0 > .item-bottom {\n background: var(--color-primary-dark);\n min-height: var(--curvature);\n }\n\n .level-0 > .item-bottom.selected {\n border-top-right-radius: var(--curvature);\n }\n\n .level-0 > .item-top.selected {\n border-bottom-right-radius: var(--curvature);\n }\n\n .level-0 > .selected-top {\n }\n\n .level-0 > .item:hover {\n background: rgba(var(--primary-rgb), 0.85);\n }\n\n .level-0 > .item.selected:hover {\n background: inherit;\n }\n\n .inline-children {\n margin-left: 0.5em;\n }\n\n .item.selected.inline.child-selected {\n background: inherit;\n }\n\n .item.selected.inline {\n }\n `;\n }\n\n @property({ type: Boolean })\n wraps = false;\n\n @property({ type: Boolean })\n collapsible = false;\n\n @property({ type: Boolean })\n collapsed: boolean;\n\n @property({ type: Boolean })\n wait: boolean;\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: String })\n expanding: string;\n\n @property({ type: String })\n value: string;\n\n // submenu to constrain to\n @property({ type: String })\n submenu: string;\n\n // http promise to monitor for completeness\n public httpComplete: Promise<void>;\n\n root: MenuItem;\n selection: string[] = [];\n pending: string[] = [];\n\n constructor() {\n super();\n this.collapsed = getCookieBoolean(COOKIE_KEYS.MENU_COLLAPSED);\n }\n\n public updated(changes: Map<string, any>) {\n if (changes.has('value')) {\n this.setSelection((this.value || '').split('/'));\n }\n\n if (changes.has('submenu') && !changes.has('value')) {\n this.setSelection([this.submenu]);\n }\n\n if (changes.has('endpoint')) {\n this.root = {\n level: -1,\n endpoint: this.endpoint,\n };\n\n if (!this.wait) {\n this.loadItems(this.root);\n }\n }\n }\n\n public refresh() {\n const path = [...this.selection];\n let items = this.root.items;\n let item = null;\n while (path.length > 0) {\n const step = path.splice(0, 1)[0];\n if (items) {\n item = items.find(mi => mi.id == step);\n if (item) {\n if (item.endpoint) {\n item.loading = true;\n const itemToUpdate = item;\n fetchResults(itemToUpdate.endpoint).then((updated: MenuItem[]) => {\n // for now we only deal with updating counts\n (itemToUpdate.items || []).forEach((existing: MenuItem) => {\n const updatedItem = updated.find(\n updatedItem => updatedItem.id === existing.id\n );\n existing.count = updatedItem.count;\n });\n\n itemToUpdate.loading = false;\n this.requestUpdate('root');\n });\n }\n\n items = item.items;\n }\n } else {\n break;\n }\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n private loadItems(item: MenuItem) {\n if (item.endpoint) {\n item.loading = true;\n this.httpComplete = fetchResults(item.endpoint).then(\n (items: MenuItem[]) => {\n // update our item level\n items.forEach(subItem => (subItem.level = item.level + 1));\n item.items = items;\n item.loading = false;\n this.requestUpdate('root');\n if (this.pending && this.pending.length > 0) {\n // auto select the next pending click\n const nextId = this.pending.splice(0, 1)[0];\n if (nextId && items.length > 0) {\n const nextItem = items.find(item => item.id === nextId);\n if (nextItem) {\n this.handleItemClicked(null, nextItem);\n }\n }\n } else {\n // auto select the first item\n if (\n items.length > 0 &&\n this.selection.length >= 1 &&\n !item.inline\n ) {\n this.handleItemClicked(null, items[0]);\n }\n }\n }\n );\n }\n }\n\n private handleItemClicked(event: MouseEvent, menuItem: MenuItem) {\n if (event) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n if (menuItem.trigger) {\n window[menuItem.trigger]();\n } else {\n if (menuItem.level === 0) {\n /* this.expanding = menuItem.id;\n window.setTimeout(() => {\n this.expanding = null;\n }, 60);\n */\n }\n\n // update our selection\n if (menuItem.level >= this.selection.length) {\n this.selection.push(menuItem.id);\n } else {\n this.selection.splice(\n menuItem.level,\n this.selection.length - menuItem.level,\n menuItem.id\n );\n }\n\n if (menuItem.endpoint) {\n this.loadItems(menuItem);\n this.dispatchEvent(new Event('change'));\n } else {\n this.dispatchEvent(new Event('change'));\n\n if (this.pending && this.pending.length > 0) {\n // auto select the next pending click\n const nextId = this.pending.splice(0, 1)[0];\n const item = this.getMenuItem();\n if (nextId && item && item.items && item.items.length > 0) {\n const nextItem = item.items.find(item => item.id === nextId);\n if (nextItem) {\n this.handleItemClicked(null, nextItem);\n }\n }\n }\n\n this.pending = [];\n this.requestUpdate('root');\n }\n }\n }\n\n public getMenuItem() {\n const path = [...this.selection];\n let items = this.root.items;\n let item = null;\n while (path.length > 0) {\n const step = path.splice(0, 1)[0];\n if (items) {\n item = items.find(mi => mi.id == step);\n if (item) {\n items = item.items;\n } else {\n break;\n }\n } else {\n break;\n }\n }\n\n return item;\n }\n\n public getSelection() {\n return this.selection;\n }\n\n public setSelection(path: string[]) {\n this.pending = [...path];\n this.selection = [];\n\n if (this.wait) {\n this.wait = false;\n this.loadItems(this.root);\n }\n }\n\n private isSelected(menuItem: MenuItem) {\n if (menuItem.level < this.selection.length) {\n return this.selection[menuItem.level] == menuItem.id;\n }\n return false;\n }\n\n private isExpanded(menuItem: MenuItem) {\n const expanded = !!this.selection.find(id => menuItem.id === id);\n return expanded;\n }\n\n private renderMenuItem = (menuItem: MenuItem): TemplateResult => {\n const isSelected = this.isSelected(menuItem);\n const isChildSelected =\n isSelected && this.selection.length > menuItem.level + 1;\n\n const icon = menuItem.icon\n ? html`<temba-icon\n size=\"${menuItem.level === 0 ? '1.5' : '1'}\"\n name=\"${menuItem.icon}\"\n ></temba-icon>`\n : null;\n\n const item = html` <div\n class=\"item-top ${isSelected ? 'selected' : null}\"\n ></div>\n\n <div\n id=\"menu-${menuItem.id}\"\n class=\"item ${isSelected ? 'selected' : ''} ${isChildSelected\n ? 'child-selected'\n : ''} ${menuItem.inline ? 'inline' : ''} ${this.expanding &&\n this.expanding === menuItem.id\n ? 'expanding'\n : ''} ${this.isExpanded(menuItem) ? 'expanded' : ''}\"\n @click=${event => {\n this.handleItemClicked(event, menuItem);\n }}\n >\n ${this.collapsed || menuItem.level === 0\n ? html`<temba-tip\n style=\"display:flex;\"\n text=\"${menuItem.name}\"\n position=\"right\"\n >${icon}</temba-tip\n >`\n : icon}\n\n <div\n class=\"name\"\n style=\"flex-grow:1; white-space: ${this.wraps ? 'normal' : 'nowrap'};\"\n >\n ${menuItem.name}\n </div>\n ${menuItem.count || menuItem.count == 0\n ? html` <div class=\"count\">${menuItem.count.toLocaleString()}</div> `\n : null}\n </div>\n\n <div class=\"item-bottom ${isSelected ? 'selected' : null}\"></div>`;\n\n return item;\n };\n\n public toggleCollapsed() {\n this.collapsed = !this.collapsed;\n setCookie(COOKIE_KEYS.MENU_COLLAPSED, this.collapsed);\n this.requestUpdate('root');\n }\n\n public render(): TemplateResult {\n if (!this.root || !this.root.items) {\n return html`<temba-loading />`;\n }\n\n let items = this.root.items;\n const levels = [];\n\n levels.push(\n html`<div class=\"level level-0 ${this.submenu ? 'hidden' : ''}\">\n <div class=\"top\"></div>\n\n ${items\n .filter(item => !item.bottom)\n .map((item: MenuItem) => {\n return this.renderMenuItem(item);\n })}\n\n <div class=\"empty\"></div>\n ${items\n .filter(item => !!item.bottom)\n .map((item: MenuItem) => {\n return this.renderMenuItem(item);\n })}\n <div class=\"bottom\"></div>\n </div>`\n );\n\n this.selection.forEach((id, index) => {\n const selected = (items || []).find(item => item.id === id);\n if (selected) {\n items = selected.items;\n } else {\n items = null;\n }\n\n if (items && items.length > 0 && !selected.inline) {\n levels.push(\n html`<div class=\"level level-${index + 1}\">\n ${index == 0 && !this.submenu\n ? html`<div class=\"section\">${selected.name}</div>`\n : null}\n ${items.map((item: MenuItem) => {\n if (item.inline && item.items && this.isSelected(item)) {\n return html`${this.renderMenuItem(item)}\n <div class=\"inline-children\">\n ${item.items.map((child: MenuItem) => {\n return this.renderMenuItem(child);\n })}\n </div>`;\n }\n return this.renderMenuItem(item);\n })}\n </div>`\n );\n }\n });\n\n const menu = html`<div class=\"root\">${levels}</div>`;\n\n if (this.collapsible) {\n return html`\n <div style=\"display:flex\">\n ${menu}\n <div class=\"collapse-toggle\" @click=${this.toggleCollapsed}></div>\n </div>\n `;\n }\n\n return html`${menu}`;\n }\n}\n"]}
1
+ {"version":3,"file":"TembaMenu.js","sourceRoot":"","sources":["../../../src/list/TembaMenu.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, TemplateResult } from 'lit-element';\nimport { RapidElement } from '../RapidElement';\nimport {\n COOKIE_KEYS,\n fetchResults,\n getCookieBoolean,\n setCookie,\n} from '../utils';\n\nexport interface MenuItem {\n id?: string;\n name?: string;\n count?: number;\n icon?: string;\n endpoint?: string;\n loading?: boolean;\n bottom?: boolean;\n level?: number;\n trigger?: string;\n href?: string;\n items?: MenuItem[];\n inline?: boolean;\n}\n\nexport class TembaMenu extends RapidElement {\n static get styles() {\n return css`\n :host {\n width: 100%;\n display: block;\n --color-widget-bg-focused: transparent;\n --options-block-shadow: none;\n }\n\n .section {\n font-size: 1.875rem;\n margin-bottom: 0.2em;\n color: var(--color-text-dark);\n }\n\n .collapse-toggle {\n width: 0.5em;\n cursor: pointer;\n display: block;\n margin-right: 5px;\n margin-top: 3px;\n margin-bottom: 3px;\n }\n\n .collapse-toggle:hover {\n background: rgb(100, 100, 100, 0.05);\n }\n\n .item {\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n display: flex;\n font-size: 1.15em;\n }\n\n .item.selected {\n background: var(--color-selection);\n color: var(--color-primary-dark);\n --icon-color: var(--color-primary-dark);\n }\n\n .root {\n display: flex;\n flex-direction: row;\n height: 100%;\n }\n\n .level {\n display: flex;\n flex-direction: column;\n }\n\n .level.hidden {\n display: none;\n }\n\n .submenu {\n }\n\n .level-0 > .item {\n background: var(--color-primary-dark);\n --icon-color: #fff;\n font-size: 1em;\n }\n\n .level-0 > .top {\n padding-top: var(--menu-padding);\n background: var(--color-primary-dark);\n }\n\n .level-0 > .empty {\n background: var(--color-primary-dark);\n align-self: stretch;\n flex-grow: 1;\n }\n\n .level-0 > .bottom {\n height: 1em;\n background: var(--color-primary-dark);\n }\n\n .level-0 > .item > .name {\n display: none;\n }\n\n .level-0.expanding {\n }\n\n .level-0.expanded {\n background: inherit;\n }\n\n .level-0 > .item.selected {\n background: inherit;\n --icon-color: var(--color-primary-dark);\n }\n\n .level {\n padding: var(--menu-padding);\n }\n\n .level-0 {\n padding: 0px;\n }\n\n .item {\n padding: 0.2em 0.75em;\n margin-top: 0.1em;\n border-radius: var(--curvature);\n }\n\n .item > temba-icon {\n margin-right: 0.5em;\n }\n\n .item > .name {\n min-width: 7em;\n }\n\n .level-0 > .item {\n padding: 1em 1em;\n margin-top: 0em;\n border-radius: 0px;\n }\n\n .level-0 > .item > temba-icon {\n margin-right: 0px;\n }\n\n .level-0 > .item > .name {\n min-width: 0px;\n }\n\n .count {\n align-self: center;\n margin-left: var(--menu-padding);\n font-size: 0.8em;\n font-weight: 400;\n }\n\n .level-0 > .item-top {\n background: var(--color-primary-dark);\n min-height: var(--curvature);\n }\n\n .level-0 > .item-bottom {\n background: var(--color-primary-dark);\n min-height: var(--curvature);\n }\n\n .level-0 > .item-bottom.selected {\n border-top-right-radius: var(--curvature);\n }\n\n .level-0 > .item-top.selected {\n border-bottom-right-radius: var(--curvature);\n }\n\n .level-0 > .selected-top {\n }\n\n .level-0 > .item:hover {\n background: rgba(var(--primary-rgb), 0.85);\n }\n\n .level-0 > .item.selected:hover {\n background: inherit;\n }\n\n .inline-children {\n margin-left: 0.5em;\n }\n\n .item.selected.inline.child-selected {\n background: inherit;\n }\n\n .item.selected.inline {\n }\n `;\n }\n\n @property({ type: Boolean })\n wraps = false;\n\n @property({ type: Boolean })\n collapsible = false;\n\n @property({ type: Boolean })\n collapsed: boolean;\n\n @property({ type: Boolean })\n wait: boolean;\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: String })\n expanding: string;\n\n @property({ type: String })\n value: string;\n\n // submenu to constrain to\n @property({ type: String })\n submenu: string;\n\n // http promise to monitor for completeness\n public httpComplete: Promise<void>;\n\n root: MenuItem;\n selection: string[] = [];\n pending: string[] = [];\n\n constructor() {\n super();\n this.collapsed = getCookieBoolean(COOKIE_KEYS.MENU_COLLAPSED);\n }\n\n public updated(changes: Map<string, any>) {\n if (changes.has('value')) {\n this.setSelection((this.value || '').split('/'));\n }\n\n if (changes.has('submenu') && !changes.has('value')) {\n this.setSelection([this.submenu]);\n }\n\n if (changes.has('endpoint')) {\n this.root = {\n level: -1,\n endpoint: this.endpoint,\n };\n\n if (!this.wait) {\n this.loadItems(this.root);\n }\n }\n }\n\n public refresh() {\n const path = [...this.selection];\n let items = this.root.items;\n let item = null;\n while (path.length > 0) {\n const step = path.splice(0, 1)[0];\n if (items) {\n item = items.find(mi => mi.id == step);\n if (item) {\n if (item.endpoint) {\n item.loading = true;\n const itemToUpdate = item;\n fetchResults(itemToUpdate.endpoint).then((updated: MenuItem[]) => {\n // for now we only deal with updating counts\n (itemToUpdate.items || []).forEach((existing: MenuItem) => {\n const updatedItem = updated.find(\n updatedItem => updatedItem.id === existing.id\n );\n existing.count = updatedItem.count;\n });\n\n itemToUpdate.loading = false;\n this.requestUpdate('root');\n });\n }\n\n items = item.items;\n }\n } else {\n break;\n }\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n private loadItems(item: MenuItem) {\n if (item && item.endpoint) {\n item.loading = true;\n this.httpComplete = fetchResults(item.endpoint).then(\n (items: MenuItem[]) => {\n // update our item level\n items.forEach(subItem => (subItem.level = item.level + 1));\n item.items = items;\n item.loading = false;\n this.requestUpdate('root');\n if (this.pending && this.pending.length > 0) {\n // auto select the next pending click\n const nextId = this.pending.splice(0, 1)[0];\n if (nextId && items.length > 0) {\n const nextItem = items.find(item => item.id === nextId);\n if (nextItem) {\n this.handleItemClicked(null, nextItem);\n }\n }\n } else {\n // auto select the first item\n if (\n items.length > 0 &&\n this.selection.length >= 1 &&\n !item.inline\n ) {\n this.handleItemClicked(null, items[0]);\n }\n }\n }\n );\n }\n }\n\n private handleItemClicked(event: MouseEvent, menuItem: MenuItem) {\n if (event) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n if (menuItem.trigger) {\n window[menuItem.trigger]();\n } else {\n if (menuItem.level === 0) {\n /* this.expanding = menuItem.id;\n window.setTimeout(() => {\n this.expanding = null;\n }, 60);\n */\n }\n\n // update our selection\n if (menuItem.level >= this.selection.length) {\n this.selection.push(menuItem.id);\n } else {\n this.selection.splice(\n menuItem.level,\n this.selection.length - menuItem.level,\n menuItem.id\n );\n }\n\n if (menuItem.endpoint) {\n this.loadItems(menuItem);\n this.dispatchEvent(new Event('change'));\n } else {\n this.dispatchEvent(new Event('change'));\n\n if (this.pending && this.pending.length > 0) {\n // auto select the next pending click\n const nextId = this.pending.splice(0, 1)[0];\n const item = this.getMenuItem();\n if (nextId && item && item.items && item.items.length > 0) {\n const nextItem = item.items.find(item => item.id === nextId);\n if (nextItem) {\n this.handleItemClicked(null, nextItem);\n }\n }\n }\n\n this.pending = [];\n this.requestUpdate('root');\n }\n }\n }\n\n public getMenuItem() {\n const path = [...this.selection];\n let items = this.root.items;\n let item = null;\n while (path.length > 0) {\n const step = path.splice(0, 1)[0];\n if (items) {\n item = items.find(mi => mi.id == step);\n if (item) {\n items = item.items;\n } else {\n break;\n }\n } else {\n break;\n }\n }\n\n return item;\n }\n\n public getSelection() {\n return this.selection;\n }\n\n public setSelection(path: string[]) {\n this.pending = [...path];\n this.selection = [];\n\n if (this.wait) {\n this.wait = false;\n this.loadItems(this.root);\n }\n }\n\n private isSelected(menuItem: MenuItem) {\n if (menuItem.level < this.selection.length) {\n return this.selection[menuItem.level] == menuItem.id;\n }\n return false;\n }\n\n private isExpanded(menuItem: MenuItem) {\n const expanded = !!this.selection.find(id => menuItem.id === id);\n return expanded;\n }\n\n private renderMenuItem = (menuItem: MenuItem): TemplateResult => {\n const isSelected = this.isSelected(menuItem);\n const isChildSelected =\n isSelected && this.selection.length > menuItem.level + 1;\n\n const icon = menuItem.icon\n ? html`<temba-icon\n size=\"${menuItem.level === 0 ? '1.5' : '1'}\"\n name=\"${menuItem.icon}\"\n ></temba-icon>`\n : null;\n\n const item = html` <div\n class=\"item-top ${isSelected ? 'selected' : null}\"\n ></div>\n\n <div\n id=\"menu-${menuItem.id}\"\n class=\"item ${isSelected ? 'selected' : ''} ${isChildSelected\n ? 'child-selected'\n : ''} ${menuItem.inline ? 'inline' : ''} ${this.expanding &&\n this.expanding === menuItem.id\n ? 'expanding'\n : ''} ${this.isExpanded(menuItem) ? 'expanded' : ''}\"\n @click=${event => {\n this.handleItemClicked(event, menuItem);\n }}\n >\n ${this.collapsed || menuItem.level === 0\n ? html`<temba-tip\n style=\"display:flex;\"\n text=\"${menuItem.name}\"\n position=\"right\"\n >${icon}</temba-tip\n >`\n : icon}\n\n <div\n class=\"name\"\n style=\"flex-grow:1; white-space: ${this.wraps ? 'normal' : 'nowrap'};\"\n >\n ${menuItem.name}\n </div>\n ${menuItem.count || menuItem.count == 0\n ? html` <div class=\"count\">${menuItem.count.toLocaleString()}</div> `\n : null}\n </div>\n\n <div class=\"item-bottom ${isSelected ? 'selected' : null}\"></div>`;\n\n return item;\n };\n\n public toggleCollapsed() {\n this.collapsed = !this.collapsed;\n setCookie(COOKIE_KEYS.MENU_COLLAPSED, this.collapsed);\n this.requestUpdate('root');\n }\n\n public render(): TemplateResult {\n if (!this.root || !this.root.items) {\n return html`<temba-loading\n units=\"3\"\n size=\"10\"\n direction=\"column\"\n style=\"margin:1em;margin-right:0em\"\n />`;\n }\n\n let items = this.root.items;\n const levels = [];\n\n levels.push(\n html`<div class=\"level level-0 ${this.submenu ? 'hidden' : ''}\">\n <div class=\"top\"></div>\n\n ${items\n .filter(item => !item.bottom)\n .map((item: MenuItem) => {\n return this.renderMenuItem(item);\n })}\n\n <div class=\"empty\"></div>\n ${items\n .filter(item => !!item.bottom)\n .map((item: MenuItem) => {\n return this.renderMenuItem(item);\n })}\n <div class=\"bottom\"></div>\n </div>`\n );\n\n this.selection.forEach((id, index) => {\n const selected = (items || []).find(item => item.id === id);\n if (selected) {\n items = selected.items;\n } else {\n items = null;\n }\n\n if (items && items.length > 0 && !selected.inline) {\n levels.push(\n html`<div class=\"level level-${index + 1}\">\n ${index == 0 && !this.submenu\n ? html`<div class=\"section\">${selected.name}</div>`\n : null}\n ${items.map((item: MenuItem) => {\n if (item.inline && item.items && this.isSelected(item)) {\n return html`${this.renderMenuItem(item)}\n <div class=\"inline-children\">\n ${item.items.map((child: MenuItem) => {\n return this.renderMenuItem(child);\n })}\n </div>`;\n }\n return this.renderMenuItem(item);\n })}\n </div>`\n );\n }\n });\n\n const menu = html`<div class=\"root\">${levels}</div>`;\n\n if (this.collapsible) {\n return html`\n <div style=\"display:flex\">\n ${menu}\n <div class=\"collapse-toggle\" @click=${this.toggleCollapsed}></div>\n </div>\n `;\n }\n\n return html`${menu}`;\n }\n}\n"]}