App lifecycle events are events that mark the state changes of your app - such as,
- Being initialized for the first time
- Being activated
- Being deactivated
App lifecycle methods are the methods that the Freshworks developer platform provides, to enable the app to react to the lifecycle events and accordingly refresh its app data.
The Freshdesk web interface is built as a single-page application. Unlike a traditional web application, a single-page app does not reload the entire page when there is a context change; it modifies only the relevant sections and passes a client object (that contains product context as well) to your app. For example, if you are on a ticket page and you navigate to a new ticket, only certain sections of the page are reloaded. If your app is in the reloaded section, the parent application initializes your app and passes the client object to your app. Your front-end app communicates with the parent app (the product on which the app is deployed) by using the client reference.
To enable your app to react to lifecycle events, in the app.js file,
- Subscribe to the app.initialized event. When the app is successfully initialized, the parent application passes a client reference to the app.
- After app initialization, to enable your app to react to app activation,
- Use the client reference, subscribe to the app.activated event, and register a callback method to be executed when the event occurs.
- Define the callback method.
- After app initialization, to enable your app to react to app deactivation,
- Use the client reference, subscribe to the app.deactivated event, and register a callback method to be executed when the event occurs.
- Define the callback method.
Note:Apps that are deployed in the ticket_attachment or ticket_conversation_editor placeholders are initialized every time the ticket editor is opened.
Subscribe to app.initialized
Use the sample code shown on the right pane, to listen to the app.initialized event.
App initialization occurs when the page that contains your app is loaded for the first time.
Apps that are deployed in the ticket_attachment or ticket_conversation_editor placeholders are initialized every time the ticket editor is opened.
If app initialization is successful, the parent application (the product on which the app is deployed) passes a client reference to the app. You can use the client reference to,
- Include the app.activated and app.deactivated listeners in your app code.
- Include any front-end methods (data methods, events methods, and interface methods) to your app code. Front-end methods help in communication between your app and the parent app.
Unless you are building an app that is completely isolated (independent of the data on the page), ensure that the core logic of the app is not placed within the app.initialized() method. Place the logic within the app.activated() method.
Use app.activated
The app.activated event occurs based on certain actions on the Freshdesk UI that activate the app.
| App location | When does the event occur? |
|---|---|
| Ticket Sidebar or Contact Sidebar | When a user clicks the app icon for the first time to open the app (apps are in a minimized state when the page loads). |
| Ticket Requester Info | When the page loads. |
| Full Page Apps, Ticket Top Navigation, Ticket Conversation Editor and Attachment | When a user clicks the app icon. |
| Global CTI | When the page loads. |
| The app.activated event also occurs when the app user navigates from one ticket to another on the Ticket Details page. | |
To subscribe to the event, register the callback method, and define the callback method, use the sample code on the right pane.
Use app.deactivated
The app.deactivated event occurs when the app goes out of scope, that is, when the app is closed and the app user navigates to another page of the parent application.
You can use app.deactivated to clean stale data, whenever your app is not in scope.
To subscribe to the event, register the callback method, and define the callback method, use the sample code on the right pane.