App: RelayDesk Instance Hub
Repo: freshworks-developers/instance-method-samples
RelayDesk is a B2B SaaS vendor using Freshdesk for customer tickets and Freshservice for internal IT. Agents often work the same ticket from multiple UI panels — sidebar apps, requester strips, and modals — and need those surfaces to stay in sync without REST polling or custom browser extensions.
Scenario: A tier-2 agent reviews account context in the requester-info strip while a tier-1 agent updates notes in the ticket sidebar. Both need to see when the other posts a quick status without refreshing the page.
Use Case: RelayDesk runs in both ticket_sidebar and ticket_requester_info on the same ticket page. Each panel calls client.instance.get() to list active peers, then client.instance.send({ message, receiver }) with an explicit receiver id. The target panel handles the payload in client.instance.receive().
Platform tie-in: Instance method — get, send, receive on the same browser tab.
Scenario: Escalation workflows open a modal to confirm requester details before reassigning a ticket. The parent sidebar already knows name and email; the modal should not ask the agent to retype them.
Use Case: The sidebar triggers client.interface.trigger('showModal', { data: { name, email } }). The modal reads (await client.instance.context()).modalData and pre-fills the form. On submit, the modal sends the updated payload back via client.instance.send() and closes with client.instance.close().
Platform tie-in: showModal data → modalData on the modal instance context.
Scenario: Custom apps can mount in several placeholders simultaneously (sidebar, requester info, modal). Developers must resolve valid instanceId values before calling send.
Use Case: RelayDesk polls client.instance.get() every few seconds and renders a live list — instance id, location name, and which row is the current instance. The send form dropdown is populated from the same list, excluding self.
Scenario: Default iframe height is too small for instance lists and message logs.
Use Case: Each surface calls client.instance.resize({ height }) on activate — sidebar 700px, requester info 420px, modal 480px.
| Surface | File |
|---|---|
| Ticket sidebar (Instance Hub) | app/scripts/ticket-sidebar.js + lib/instance-hub.js |
| Requester info (cross-reply) | app/scripts/ticket-requester-info.js |
| Modal (modalData + submit) | app/scripts/modal.js |
fdk run