Freshservice Modular App (platform version: 3.0) not opening when clicking app icon in ticket_conversion_editor?

[AsifFayaz (Asif Fayaz S)]

I’m developing a modular app (platform version: 3.0). When clicking the custom app icon from ticket_conversion_editor in Freshservice, it’s not opening the right side app window. But the same works for Freshdesk.

I have attached the necessary screenshots.

[Debjani (Debjani Chatterjee)]

Hey @AsifFayaz

Can you please try this

"modules": {
  "service_ticket": {
    "location": {
      "ticket_conversation_editor": {
        "url": "index.html",
        "icon": "icon.svg"


      }
    }
  },

Changing the module to service_ticket for Freshservice should work,
Change back to support_ticket for Freshdesk

You can select the Product and check which module-specific placeholder works with which product in the documentation.

[Thakur_Ganeshsingh (Thakur Ganeshsingh Thakur)]

Hi @AsifFayaz ,

I understand you are trying to use the ticket_conversation_editor placeholder for both Freshservice and Freshdesk via support_ticket and service_ticket module. From the looks of it you are using the default index.html page for rendering the content for the placeholder. Furthermore, you are trying to find parity between Freshdesk and Freshservice where you are expecting a sidebar modal to open up when clicking on the app icon.

There are two things to notice here

1. The default index.html is built for Freshdesk where it uses data method to get contact information, however the same is not applicable for Freshservice.
   For example: support_ticket module supports these data methods whereas service_ticket supports these data methods.
   Since support_ticket supports contact data method the default code shown below works without error

   async function renderText() {
       const textElement = document.getElementById('apptext');
       const contactData = await client.data.get('contact');
       const {
         contact: { name }
       } = contactData;
     
       textElement.innerHTML = `Ticket is created by ${name}`;
     }
   }
   

2. The service_ticket module supports requester data method to get the same information so should use something like

   function renderContactName() {
     var textElement = document.getElementById('apptext');
     client.data
       .get('requester')
       .then(function(payload) {
         textElement.innerHTML = `Data Method returned: ${payload.requester.name}`;
       })
       .catch(handleErr);
       console.log(textElement)
   }
   

3. We recommend using different views for different placeholders to keep things clean

4. Furthermore, Freshservice doesn’t open the modal window like Freshdesk instead the content is loaded inside the conversation editor window itself. If you wish to open a modal view for Freshservice you can use the interface method to do so.
   For example

   try {
     let data = client.interface.trigger('showModal', {
     title: 'Sample App Form',
     template: './views/modal.html' });
     console.log(data); // success message
   } catch (error) {
       // failure operation
     console.error(error);
   }
   

5. For more info, refer support_ticket-ticket_conversation_editor and service_ticket-ticket_conversation_editor

Meanwhile, we will confirm with the Freshservice product team if this is an expected product behavior or an anomaly.
cc: @Raviraj @zach_jones_noel @Debjani @Ashok_Prabhu

Regards,
Thakur