function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Brett WagnerBrett Wagner 

Customizing snap-ins chat parameters in community

I'm building a custom pre-chat form that I'm using with a snap-ins chat deployment. I am using it in a Salesforce community and everything works great except I have no way of sending specific cases that I want to attach to the transcript and to display to the agent. I know exactly how to do this using the code snippet route, but since the chat is being used in the community there is no way to access any of the embedded_svc information because of locker service. I tried making a visualforce page and using the snippet, which allowed me to access embedded_svc, however it broke the chat altogether. Any ideas for how to pass an existing case ID to the chat so that it shows the existing case instead of making a new one? I've tried at least ten different ways to do this, but all have failed. Thanks everyone in advance.
Julia KrauseJulia Krause
Hy Brett, did you find an Idea for that problem? I looking for an solution, too?
Brett WagnerBrett Wagner
No, what I ended up doing was getting the existing case Id and sending it as the subject for the case (I send "Child of case with Id#005...."). Then I had a before insert trigger that set the parentId on this new case made by snapin to the Id that was sent in the subject. Then I had to write a  visualforce page that I put on the case page layout that is invisible which only contains console-side javascript to check for the "Child of case with Id#005...." string  and it opens the existing case in a new tab and closes the child case. It's a huge mess of a workaround, but it works. When the transcript is inserted then I search for the child case, attach the parent to the transcript, then delete the child case. It's a lot of custom code, but it's the only way I could think of to accomplish this.
Bhavesh Jain 41Bhavesh Jain 41
hey Brett,
I am stuck in part one which you have achieved for building custom prechat form
I have created a lightning component for the pre chat form and over-ridden that in a snap-ins setting and the prechat form loads just fine however when I click on start chat it does not fire the chat:

Below is the code:
==============
Component: 

<aura:component
    implements="lightningsnapin:prechatUI,flexipage:availableForAllPageTypes,force:appHostable,force:lightningQuickActionWithoutHeader"
    controller="Bot_PreChatCmpCnt">
      
    <aura:attribute name="userId" access="PRIVATE" type="string" default="-"/>
    <aura:attribute name="FirstName" access="PRIVATE" type="string" />
    <aura:attribute name="LastName" access="PRIVATE" type="string" />
    <aura:attribute name="Email" access="PRIVATE" type="string" />
    <aura:attribute name="Phone" access="PRIVATE" type="string" />
    <aura:attribute name="Salutation" access="PRIVATE" type="string" /> 
    <aura:attribute name="Organization_Name__c" access="PRIVATE" type="string" />.
   <!-- <aura:attribute name="OrganizationType" access="PRIVATE" type="string" /> -->
  
    <!-- Contains methods for getting pre-chat fields, starting a chat, and validating fields -->
    <lightningsnapin:prechatAPI aura:id="prechatAPI"/>
      
  
    <!-- After this component has rendered, call the controller's onRender function -->
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    
    <aura:renderIf isTrue="{!v.userId}">
        
            <lightning:input type="text" value="{!v.Salutation}" label="Salutation *"/> 
            <lightning:input type="text" value="{!v.FirstName}" label="Name *"/>
            <lightning:input type="text" value="{!v.LastName}" label="Lastname *"/>
            <lightning:input type="text" value="{!v.Email}" label="Email *"/>
            <lightning:input type="text" value="{!v.Phone}" label="Phone *"/>
            <lightning:input type="text" value="{!v.Organization_Name__c}" label="Organisation Name *"/>
        <!--    <lightning:input type="text" value="{!v.OrganizationType}" label="Organization Type *"/> -->
        <aura:set attribute="else">
              <lightning:input type="text" value="" label="Salutation *"/> 
            <lightning:input type="text" value="" label="Name *"/>
            <lightning:input type="text" value="" label="Lastname *"/>
            <lightning:input type="text" value="" label="Email *"/>
            <lightning:input type="text" value="" label="Phone *"/>
            <lightning:input type="text" value="" label="Organisation Name *"/>
        <!--    <lightning:input type="text" value="" label="Organization Type *"/> -->
        </aura:set>
       
    </aura:renderIf>
     <lightning:button label="Start chat!" onclick="{!c.onStartButtonClick}"/>
        
    
</aura:component>

Client side js:
==========
({
doInit: function(component, event, helper) {
    debugger
        var prechatFields = component.find("prechatAPI").getPrechatFields();
        var action = component.get("c.getCurrentUser");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                var result = JSON.parse(response.getReturnValue());
                console.log(result, embedded_svc);
                component.set('v.userId', result.userId);
                if(result.userId){
                    component.set('v.Salutation', result.Salutation);
                    component.set('v.FirstName', result.FirstName);
                    component.set('v.LastName', result.LastName);
                    component.set('v.Email', result.Email);
                    component.set('v.Phone', result.Phone);
                    component.set('v.Organization_Name__c', result.Organization_Name__c);
                    //component.set('v.OrganizationType', result.OrganizationType);
                    helper.startChat(component, event, helper);
                }
            }else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        console.log("Error message: " +
                                 errors[0].message);
                    }
                } else {
                    console.log("Unknown error");
                }
            }
        });
        $A.enqueueAction(action);
    },
    onStartButtonClick: function(component, event, helper) {
        //handling errors

       // if(!component.get('v.FirstName')
       //   || !component.get('v.LastName')
        //   || !component.get('v.Email')
        //|| !component.get('v.Salutation')
        // || !component.get('v.Phone')
        //  || !component.get('v.Organization_Name__c')) return alert('Missing fields.');
        helper.startChat(component, event, helper);
    }
});

Server side controller:
=================
public class Bot_PreChatCmpCnt {
    @auraenabled
    public static String getCurrentUser(){
        Map<String,Object> output = new Map<String,Object>();
        User u = [Select Username, FirstName, LastName, Email, contactId From User Where Id = :UserInfo.getUserId()];
        system.debug('******user*******'+u);
        if(u.contactId != NULL)
        {
        contact c = [Select Id, Salutation, FirstName, LastName, Email, Phone, Contact_Type__c, Organization_Name__c From Contact Where Id =:u.ContactId];
        system.debug('******Contact*******'+c);
        if(c.Id != null){
            output.put('userId', u.UserName);
            system.debug('******user*******'+u.UserName);
            output.put('FirstName', c.FirstName);
            output.put('LastName', c.LastName);
            output.put('Email', c.Email);
            output.put('Salutation', c.Salutation);
            output.put('Phone', c.Phone);
            output.put('Organization_Name__c', c.Organization_Name__c);
            //output.put('OrganizationType', c.Contact_Type__c);
           system.debug('******user*******'+c);
        }
            
            else{
            output.put('userId', '');
            }
        }
        return JSON.serialize(output);
    }
        
}

Handler 
=========
({
      
    startChat: function(component, event, helper){
        debugger
        var fields = [
            {
               label: 'Salutation',
               name: 'Salutation',
               value: component.get('v.Salutation')
            } ,
            {
                label: 'FirstName',
                name: 'FirstName',
                value: component.get('v.firstName')
            } ,
            {
                label: 'LastName',
                name: 'LastName',
                value: component.get('v.LastName')
            }  ,
            {
                label: 'Email',
                name: 'Email',
                value: component.get('v.Email')
            },{
                label: 'Username',
                name: 'Username__c',
                value: component.get('v.userId'),
            },
            {
                label: 'Phone',
                name: 'Phone',
                value: component.get('v.Phone')
            } ,
            {
                label: 'Organization Name',
                name: 'Organization_Name__c',
                value: component.get('v.Organization_Name__c')
            } 
            
        ];
       // try{
        if(component.find("prechatAPI").validateFields(fields).valid) {
            component.find("prechatAPI").startChat(fields);
        }
       else {
            console.warn("Prechat fields did not pass validation!");
        }
       // }
        //catch(e){
        //    console.log(e);
       // }
    }
});