> For the complete documentation index, see [llms.txt](https://docs.gridmate.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.gridmate.io/advanced-guides/salesforce-classic-deployment.md).

# Salesforce Classic Setup

GridMate can be deployed on Salesforce Classic. Only RelatedList and ListView grids are supported. To run GridMate on Classic, we use Salesforce [Lightning out](https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lightning_out). 

## Lightning application setup

To run the Lightning out on Classic, a lightning app **VFListViewDataGridApp** should be created with the markup below.

```markup
<aura:application extends="ltng:outApp" >
    <aura:dependency resource="gmpkg:VFListViewDataGridComponent"/>
    <aura:dependency resource="markup://force:showToast" type="EVENT"/>
    <aura:dependency resource="markup://force:refreshView" type="EVENT"/>
</aura:application>
```

## Visualforce page setup

Create a Visualforce page to wrap GridMate component using the Lightning out technology.

```markup
<apex:page controller="VFListViewDataGridController"
           showHeader="true"            
           sidebar="false">
    <apex:includeLightning />
    
    <div id="workbench" />
    
    <script>
    $Lightning.use("{!lightningApp}", function() {        
        //prepare attributes
        let attributes = JSON.parse('{!attributes}' || '{}');
        attributes = Object.assign(attributes, {
            "aura:id": "listViewGrid",
            "relatedObjectName" : "{!relatedObjectName}",
            "listViewName" : "{!listViewName}"
            "canFilter": true            
        });
        
        //create the data grid
        $Lightning.createComponent("gmpkg:VFListViewDataGridComponent",
                                   attributes,
                                   "workbench",
                                   function(component) {
                                       $A.eventService.addHandler({
                                           event: 'force:showToast',
                                           handler: function(event) { 
                                               let toast = component.find("toast");
                                               toast.showToast(event.getParams());
                                           }
                                       });
                                   });
    });        
    </script>
</apex:page>
```

We have also to implement the Visualforce controller with its unit test class

```java
/***
* @author Hicham El Mansouri@GridMate
* @date 12/2019
* @description DataGrid controller class for VFListViewDataGrid.
*/
public with sharing class VFListViewDataGridController {
    private final String lightningApp;
    private final String relatedObjectName;
    private final String listViewName;
    private final String attributes;
    
    public VFListViewDataGridController() {
        lightningApp = ApexPages.currentPage().getParameters().get('c__lightningApp');
        relatedObjectName = ApexPages.currentPage().getParameters().get('c__object');
        attributes = ApexPages.currentPage().getParameters().get('c__attributes');
        
        listViewName = getLastUsedListView(relatedObjectName);
    }

    private static String getLastUsedListView(String objName)
    {
        try{
            RecentlyViewed recentItem = [Select Id, Name From RecentlyViewed  
                                         Where Type='ListView' Order by LastViewedDate Desc Limit 1];
            
            ListView listView = [Select Id, Name, DeveloperName From ListView 
                                 Where SobjectType=:objName And Name=:recentItem.Name Limit 1];
            
            return listView.DeveloperName;
        }        
        catch(Exception ex){
            System.debug(ex.getStackTraceString());
            return null;
        }           
    }
    
    public String getRelatedObjectName() {
        return relatedObjectName;
    }
    
    public String getAttributes() {
        return attributes;
    }
    
    public String getListViewName() {
        return listViewName;
    }       
    
    public String getLightningApp() {
        return lightningApp;
    } 
}
```

```java
/***
* @author Hicham El Mansouri@GridMate
* @date 12/2019
* @description DataGrid controller class for VFListViewDataGrid.
*/
@isTest
public class VFListViewDataGridControllerTest {
    static testMethod void testGetLastUsedListView(){
        ApexPages.currentPage().getParameters().put('c__lightningApp', 'c:VFListViewDataGridApp');
        ApexPages.currentPage().getParameters().put('c__object', 'Account');
        ApexPages.currentPage().getParameters().put('c__attributes', '%7B"canCreate"%3A+true%2C"canClone"%3A+true%7D');
        
        VFListViewDataGridController c = new VFListViewDataGridController();
        
        String lastUsed = c.getListViewName();
        if(lastUsed == null){System.assert(lastUsed == null);}
        else{ System.assert(lastUsed != null);}
        
        String relatedObjectName = c.getRelatedObjectName();
        System.assert(relatedObjectName != null);
        
        String attributes = c.getAttributes();
        System.assert(attributes != null);
        
        String lightningApp = c.getLightningApp();
        System.assert(lightningApp != null);
    }
}
```

## Mass Edit button setup

To trigger the mass edit Visualforce page, we have to configure a link on the targeted object.

![](/files/-MFFI7PaKOEbmyK7lCLv)

```javascript
{! URLFOR( "/apex/VFListViewDataGridPage?", null, 
[
  c__lightningApp='c:VFListViewDataGridApp',
  c__object='Account',
   c__attributes='{"canCreate":true,"canClone":true,"canFilter":true}'
]
)}
```

{% hint style="info" %}
Mass Edit can be enabled on any object by duplicating the link below and changing the **c\_\_object** parameter only.
{% endhint %}

The link should be added to the list of actions on a ListView. &#x20;

![](/files/-MFFJ9zFHT7IbVRhwcg4)

## Remote Site setup

GridMate uses API to fetch the ListView's metadata. Visualforce URL should be added to Remote Site Settings. See below :point\_down:&#x20;

![Remote Site settings](/files/-MFFKD-72KGmmCcqqHJW)