Posted in Lightning, Lightning Charts, Lightning Component

Generating Charts Using Lightning Components

Dev Shukla  and I had worked together on a lightning venture for a couple of months and We decided to start a blog series to share our learning and experiments with “Lightning Lovers”.Many thanks to Dev Shukla for his contributor to this blog series.You can connect with Dev at twitter and check more about him here.

Generating Charts Using Lightning Components

 HighChartJs : Highcharts was released in 2009. Highcharts is a charting library written in pure JavaScript, offering an easy way of adding interactive charts to your web site or web application. Designed from ground up with mobile browsers in mind, everything from multitouch zooming to touch-friendly tooltips responds great on mobile platforms. In modern browsers graphs are rendered in SVG, with VML support for legacy browsers (e.g. Internet Explorer 6).
chart (1).png
Business Use Case:
In general we can use standard Report chart component provided by Salesforce and using app builder we can add into Lightning layouts but for complex business use case we have to develop the custom component for the same in Lightning. For example if Sales users wants to print or download the chart in Lightning and wants to share with other team users so using standard chart component you can’t export the chart.
Here I created a sample component to display my Opportunity by Stage Name and count of deals which we are having as per stage and also it will display the percentage of opportunities as per respective stages.

Here is the working demo: Live Demo

Here some of highlights of this component.

I have used HIGHCHARTS library.
1. Download the javascript from here: DOWNLOAD
2. Upload this JS file into a static resource named as “Highcharts”.

Details of this Dynamic Chart lightning component:
1. This component is used to display graphical representation of data.
2. The component is fully dynamic means it can be used for different types of graphs/charts and different data.
3. There are 6 attributes in this component.

  • ChartType: It determines the type of chart. For eg: column, bar etc.
  • ChartTitle: The title of the chart
  • chartSubTitle: The subtitle of the chart
  • xAxisCategories: The X-Axis parameters in the graph. It is an array of string.
  • yAxisParameter: The Y-Axis parameter in the graph.
  • data: It accepts JSON format of an array of object.

Here you go step by step Instructions to create the Lightning Chart component.

  1. Apex Controller


public class LinechartController {
@AuraEnabled
    public static String getOpportunityJSON(){

       List<opportunity> lstopp = [SELECT Id, stagename FROM opportunity ];
        Map<String,Integer> mapLeadSource = new Map<String,Integer>();

        for(opportunity l : lstopp)
        {
            if(mapLeadSource.containsKey(l.stagename))
            {
                mapLeadSource.put(l.stagename, mapLeadSource.get(l.stagename)+1) ;
            }else{
                mapLeadSource.put(l.stagename, 0) ;
            }
        }
        system.debug('map values--'+mapLeadSource);
        list<RadarDataWrapper> radarData = new list<RadarDataWrapper>();

        for(String key : mapLeadSource.keySet())
        {
           RadarDataWrapper rdw = new RadarDataWrapper();
            rdw.name=key;
            rdw.y=mapLeadSource.get(key);
            radarData.add(rdw);
        }
        system.debug('rdw---'+radarData);
        return System.json.serialize(radarData);
        //return null;
    }

    /**
     * Wrapper class to serialize as JSON as return Value
     * */
    class RadarDataWrapper
    {
       @AuraEnabled
       public String name;
       @AuraEnabled
       public integer y;

    }

}

2.  Lightning Component codeDeveloper Console.pngYou can take complete component code here

3.Lightning Component JS Controller Code

({
    afterScriptsLoaded : function(component, event, helper)
    {
        helper.doInit(component,event,helper);
    }    

})

4. Lightning Component Helper code

({
    doInit : function(component, event, helper)
    {
        var action = component.get("c.getOpportunityJSON");
        action.setCallback(this, function(response) {
            var state = response.getState();
            //alert(state);
            if (state === "SUCCESS") {
                var dataObj= response.getReturnValue();
                //jsonData = dataObj;
                console.log('===='+dataObj);
                component.set("v.data",dataObj);
                helper.piechart(component,event,helper);
                helper.Linechart(component,event,helper);
                helper.donutchart(component,event,helper);
            }
        });
        $A.enqueueAction(action);
    },
    piechart : function(component,event,helper) {
        var jsonData = component.get("v.data");
        var dataObj = JSON.parse(jsonData);

        new Highcharts.Chart({
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                renderTo: component.find("chart").getElement(),
                type: 'pie'
            },
            title: {
                text: component.get("v.chartTitle")+' (Pie Chart)'
            },
            subtitle: {
                text: component.get("v.chartSubTitle")
            },
            xAxis: {
                categories: component.get("v.xAxisCategories"),
                crosshair: true
            },
            yAxis: {
                min: 0,
                title:
                {
                    text: component.get("v.yAxisParameter")
                }
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.y}</b>'
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        format: '<b>{point.name}</b>: {point.y} ',
                        style: {
                            color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                        }
                    }
                }
            },
            series: [{
                name:'StageName',
                data:dataObj
            }]

        });

    },

    Linechart : function(component,event,helper) {
        var jsonData = component.get("v.data");
        var dataObj = JSON.parse(jsonData);

        new Highcharts.Chart({
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false,
                renderTo: component.find("linechart").getElement(),
                type: 'line'
            },
            title: {
                text: component.get("v.chartTitle")+' (Line Chart)'
            },
            subtitle: {
                text: component.get("v.chartSubTitle")
            },
            xAxis: {
                categories: component.get("v.xAxisCategories"),
                crosshair: true
            },
            yAxis: {
                min: 0,
                title:
                {
                    text: component.get("v.yAxisParameter")
                }
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.y}</b>'
            },
            plotOptions: {
                line: {
                    dataLabels: {
                        enabled: true
                    },
                    enableMouseTracking: false
                }
            },
            series: [{
                name:'StageName',
                data:dataObj
            }]

        });

    },
    donutchart : function(component,event,helper) {
        var jsonData = component.get("v.data");
        var dataObj = JSON.parse(jsonData);

        new Highcharts.Chart({
            chart: {
                renderTo: component.find("donutchart").getElement(),
                type: 'pie',
                options3d: {
                    enabled: true,
                    alpha: 45
                }
            },
            title: {
                text: component.get("v.chartTitle")+' (Donut Chart)'
            },
            subtitle: {
                text: component.get("v.chartSubTitle")
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
            },
            plotOptions: {
                pie: {
                    innerSize: 100,
                    depth: 45
                }
            },
            series: [{
                type: 'pie',
                name:'StageName',
                data:dataObj
            }]

        });

    }
})

Here is Output of Component :

This slideshow requires JavaScript.

GitHub Repository
You can also download the code from the github repository here.

References :

Building Lightning Components with Chart.js

Create Lightning Charts With Chart.Js

Graphs and Charts: Lightning Component

Advertisements
Posted in Lightning, Lightning Component, Lightning Design System

Winter’18 Lightning Tree Component

Dev Shukla  and I had worked together on a lightning venture for a couple of months and We decided to start a blog series to share our learning and experiments with “Lightning Lovers”.Many thanks to Dev Shukla for his contributor to this blog series.You can connect with Dev at twitter and check more about him here.

Using lightning: tree To Display Leads with Activity Information

Winter’18 Salesforce has added a new lightning component called lightning:tree, using this we can display the hierarchy of Salesforce. lightning: tree component provides visualization of a structure hierarchy. Tree items, also known as branches, can be expanded or collapsed.This component supports only version 41.0 and above.
Winter18.png 620×378
Business Use Case: We can use this component for displaying the Hierarchy structure like Account Hierarchy, Role Hierarchy, Custom Object Hierarchy. Also, we can use this component to display the information in hierarchy level like Leads with Activity Information, Top customers with Top Deals information.
Here I created a sample component to display my Leads with respective Tasks and on click on respective Task it will display the Task important information in modal like Subject, Status, Assigned To, Due Date and comments.

Here is the working demo: Live Demo

Here you go step by step Instructions to create the Lightning tree component.

  1. Apex Controller


public class LightningTreeAuraController{
    
    @AuraEnabled
    public static List<item> getLeadTree(){
        
        List<item> items = new List<item>();
        List<Lead> leadList = new List<Lead>();
        //get list of leads and respective tasks
        leadList = [SELECT Id, Name, (SELECT Id, Subject From Tasks) From Lead LIMIT 10];
        for(Lead lead: leadList){
            
            //get task of current lead record
            List<item> taskItems = new List<item>();
            for(Task task: lead.Tasks){
                //add task items
                item taskItem = new item('Task :'+ task.Subject, String.valueOf(task.Id), false, null);
                taskItems.add(taskItem);
            }
            
            //add lead items
            item leadItem = new item('Lead :' +lead.Name, String.valueOf(lead.Id), false, taskItems);
            items.add(leadItem);
        }
        return items;
    }
    
    //Item Wrapper Class
    public class item{
        @AuraEnabled
        public String label {get; set;}
        @AuraEnabled
        public String name {get; set;}
        @AuraEnabled
        public Boolean expanded {get; set;}
        @AuraEnabled
        public List<item> items {get; set;}
        
        public item(String label, String name, Boolean expanded, List<item> items){
            this.label = label;
            this.name = name;
            this.expanded = expanded;
            this.items = items;
        }
    }
     //get task information based on Subject click
    @AuraEnabled
    public static Task getTaskDetails(Id recordId){
        Task task = [Select id,Subject,Owner.Name,Description,ActivityDate,Status from Task where Id=:recordId];
        return task;
        
    }

2.  Lightning Component code

1

You can take complete component code here

3.Lightning Component JS Controller Code

({
    doInit: function (component, event, helper) {
        helper.getLeadtree(component);
    },
    openModel: function(component,event, helper) {
        var TaskId = event.getParam('name');
        helper.getTaskDetails(component,TaskId);
    },

    closeModel: function(component, event, helper) {
        // for Hide/Close Model,set the "isOpen" attribute to "Fasle"
        component.set("v.isOpen", false);
    },
})

4. Lightning Component Helper code

({
    getLeadtree : function(component, event, helper) {
        var spinner = component.find("spnr");
        var action = component.get('c.getLeadTree');
        action.setCallback(this, function(response){
            var state = response.getState();
            if(state === 'SUCCESS'){
                //get lead and respective task list, and initialize with items
                component.set('v.items', response.getReturnValue());
                //hide spinner after getting data
                $A.util.toggleClass(spinner, "slds-hide");
            }else{
                $A.util.toggleClass(spinner, "slds-hide");
                alert('ERROR');
            }
        });
        $A.enqueueAction(action);

    },
    getTaskDetails : function(component, TaskId) {
        var action = component.get('c.getTaskDetails');

        action.setParams({
            recordId : TaskId
        });
        action.setCallback(this, function(response){
            var state = response.getState();
            //get task information and initialize with task attribute
            component.set('v.task', response.getReturnValue());
            component.set("v.isOpen", true);

        });
        $A.enqueueAction(action);
    }
})

Here is Output of Component :

This slideshow requires JavaScript.

GitHub Repository
You can also download the code from the github repository here.

References :

Salesforce Documentation
Lightning Design System : Lightning Tree

lightning:tree to display Account Hierarchy

Posted in Lightning, Lightning Component

Lightning Data Service

Salesforce has released the most awaited feature for Lightning Developers, Lightning Data Services – Standard Controller of Lightning Components! To speed up Lightning component development, Salesforce brought in Lightning Data Services. Lightning Data Service is a collection of lightning tags, methods, and events. We can relate it to Visualforce Standard Controller. 

  • Use Lightning Data Service to load, create, edit, or delete a record in your component without requiring Apex code. Lightning Data Service handles sharing rules and field-level security for you.
  • At the simplest level, you can think of Lightning Data Service as the Lightning Components version of the Visualforce standard controller. Whenever possible, use Lightning Data Service to read and modify Salesforce data in your components.
  • Lightning Data Service provides other benefits aside from the code. It’s built on highly efficient local storage that’s shared across all components that use it. Records loaded in Lightning Data Service are cached and shared across components.

LDS Architecture

Lightning Data Services consist of following:

  • force:recordPreview tag
  • getNewRecord() method
  • saveRecord() method
  • deleteRecord() method
  • recordUpdated Event
  • changeType event parameter to check record update status

Let’s see what are the benefits of Lightning Data Services:

Lightning Data Service provides reusable Aura components that:

  • Fetch records once, reducing network transfers, app server load, and database server load
  • Cache record data on the client, separate from component metadata
  • Share record data across components
  • Enable progressive record loading, caching, and merging more fields and layouts into the cache
  • Enable proactive cache population
  • Promote consistency by using only one instance of the record data across multiple components
  • Create notifications when record data changes
  • Lightning components does not enforce Field Level security while displaying data fetched from Apex controller, unlike Visualforce pages. So, it was required to check CRUD permission in apex controller. This can be skipped if you use Lightning Data Services.
  • If there are many components on record detail page, then for each component there was SOQL to fetch data which affects the performance of the entire page. But if we use LDS it’s performance will improve as time lag to fetch data from server side will be saved.
  • Also, prebuilt Lightning controller methods like Save(), getNewRecord() will help to perform DML in Lightning itself with writing any Apex.
  • Data consistency – As the record values stored on client side in the cache, it will remain same across all the components. If you update value of any field in one component, it will be consistent on another component and it notify & refresh other components automatically.

If you have a Lightning application that creates, reads, updates or deletes records, LDS is the best, most efficient way to do CRUD operations.

LDS is here to simplify developer life. Adopting LDS means you no longer have to write your own controller code. All of your data access code is contained within the LDS component, significantly reducing the complexity of your apps and pages. This reduced complexity means that you don’t have to spend as much time on performance and quality testing.

Lightning Data Service Example

References :

  1. Lightning Data Service – Standard Controller for Lightning Components
  2. Use Lightning Data Service – No To Apex Controller In Lightning Components 
  3. Lightning Data Service Basics

What’s Next?

Keep your eyes on an upcoming blog entry for more real-time examples to develop the Lightning Components using Lightning Data Service.

Wait and Watch, more to come…

pjimage.jpg

Posted in Lightning, Lightning Experience, Release Notes

Salesforce Summer’17: Top 17 Features of Lightning Experience

Salesforce published Summer’17 release(Preview) notes. If You are a lightning lover like me then In this release, you can find lot’s of new features as well as new enhancements, for example, Field History Tracking, New Setup Tab, Keyboard Shortcut, Updated Activity Timeline, Classic Email template in Lightning.

Admin Checklist Get Ready for Summer 17 Salesforce Admins

Take a look below new features in Summer 17 released for Lightning Experience:

1.Access Field History Related Lists in Lightning Experience

This is great news for all Lightning Lovers. Yes, finally you can track the history in Lightning. I posted this idea here  Track and display the field history for standard or custom objects, regardless of which Salesforce interface you’re using. If you added the History related list to objects in Salesforce Classic, you can now see it in Lightning Experience. You can also set up a field history related list in Lightning Experiences.

If you already added the History related list to your objects in Salesforce Classic, you’re all set. In Lightning Experience, look for your History related list (1) under the Related tab (2).

208_field_history_rl_lex.png

2.Switch More Users to Lightning Experience

When you enable Lightning Experience, it’s important to get your users working in—and benefiting from—the new interface. To help, the Switch Users to Lightning Experience tool now displays all users in your org so you can switch the exact group that you want in one go. The tool also makes it easier to find specific users on the list and to see which users in your org are eligible to switch. This change applies to both Lightning Experience and Salesforce Classic.

  1. The Switch Users to Lightning Experience tool is available from the Lightning Experience Migration Assistant in Setup. In the Migration Assistant, click the Set Up Users tab, then click Switch Users.

    lex_switch_user_wizard

Search the user list to find exactly the user you want (1). See at a glance which users have permission to access Lightning Experience and are eligible to switch (2), which users have already switched (3), and which users can’t be switched because they don’t have the Lightning Experience User permission (4).To switch users to Lightning Experience, click the button next to their names.

Unlike before, you can’t use this tool to switch users back to Salesforce Classic. But users can switch themselves back as needed, using the Switcher in their profile menus.

3.Make Lightning Experience the Only Experience

Ready to move from Salesforce Classic to Lightning Experience without looking back? Just hide the option to switch to Salesforce Classic from your Lightning Experience users so that they stay in Lightning Experience. This feature is new in both Lightning Experience and Salesforce Classic.

By default, when you enable Lightning Experience, your users get the Switcher, allowing them to switch back and forth between Lightning Experience and Salesforce Classic. But if you want some or all of your users to stick to Lightning Experience, you can remove the Switcher (1) .

Hide option to switch to Salesforce Classic

In Setup, enable the Hide Option to Switch to Salesforce Classic permission (2) in profiles and permission set.When you enable the permission for your Lightning Experience users, new and existing users see Lightning Experience the next time they log into Salesforce. And, they no longer see the Switch to Salesforce Classic link.

rn_lex_hide_switcher_perm

4. Ditch Your Mouse—Keyboard Shortcuts Are Here

You can now use keyboard shortcuts to maximize your efficiency and speed while working in Lightning Experience. You can search for, edit, save, and close a record—all without touching a mouse. So start planning what you want to do with all the time you’re going to save! By default, keyboard shortcuts work in all Lightning apps. This change applies to Lightning Experience only.

To view the available keyboard shortcuts, press:

  • Windows: Ctrl+/
  • macOS: Cmd+/

Screen shot of the available keyboard shortcuts for standard navigation apps.

For Lighting apps with console navigation, extra shortcuts are available to help users navigate tabs, utilities, and more.

5.Get Better Assistance with the Restyled Lightning Experience Migration Assistant

To guide you through the optimal path to enabling Lightning Experience, we’ve given the Migration Assistant an easier-to-use, wizard-style interface. The tools for assessing and previewing your org’s readiness, setting up features and users, and flipping the switch are now visible at a glance—and faster to access. Oh, and it’s also easier to find the Migration Assistant in Setup. This change applies to both Lightning Experience and Salesforce Classic.

Accessing the Migration Assistant in Salesforce Classic is a no-brainer now. From Setup, click Get Started in the Lightning Experience Migration Assistant tile at the top of the menu. (From Setup in Lightning Experience, continue to access the Migration Assistant from the Lightning Experience link.)

Lightning Experience Migration Assistant tile in Salesforce Classic Setup Menu

 The new Migration Assistant is a clean, concise wizard, with tabs that highlight the steps for transitioning to Lightning Experience.

Restyled Lightning Experience Migration Assistant, with highlight around tabs at the top of the page

The interface focuses on specific tasks, one at a time. But you aren’t restricted to going through the tabs in a sequential order. As before, you can use the Migration Assistant to run tools like the Readiness Check and the Preview whenever and as often as needed. Simply click the desired tab to get down to business.

Check Readiness tab in the Lightning Experience Migration Assistant

6. Relate Accounts to Leads Faster with Account Matching

When sales users convert leads, if the lead company name matches any of your accounts, it’s quick and easy to choose one of the matching accounts. This change applies to Lightning Experience only.

Previously in Lightning Experience, if there was a single exact match between the lead company name and an existing account name, the account populated the Account Name field during lead conversion. New account matching brings Lightning Experience in line with Salesforce Classic.

  • Support for person accounts—If the lead contains a company name, we search business accounts. If there is no company name, we search person accounts instead.
  • Enhanced type ahead—Type-ahead search in the Account Name field now searches across all accounts rather than searching only the user’s recently used accounts.
  • Multiple match—When a user clicks the Account Name field during lead conversion, a dropdown menu includes a list of all accounts that match the lead’s company name. If the lead does not have a company name, the list contains matching person accounts.

7.Add Members to Campaigns from Reports in Lightning Experience

Your marketing department can quickly target specific groups of leads, contacts, or person accounts by adding them to campaigns directly from standard and custom reports. This change applies to both Lightning Experience and Salesforce Classic.

Reps can add up to 50,000 returned records to campaigns by clicking Add to Campaign (1).

The Add to Campaign action on reports

To let marketers add members to campaigns from custom reports, the report’s primary object must be Lead or Contact. The custom report type must also include the Full Name field.Previously, Salesforce Classic allowed members to be added to campaigns only from standard reports. The ability to add members to campaigns from custom report types is available in both Salesforce Classic and Lightning Experience.

8.Decide How Path Displays

A path is now closed when the page loads, helping users view more record details without scrolling. You can configure how users display Path. This change applies to Lightning Experience only.

To view or hide a path’s key fields and guidance, users click.Show More

The Show More button with a closed path.

To let your users decide whether a path’s guidance and key fields display automatically when the page loads, from Setup, enter Path Settings in the Quick Find box, then select Path Settings. Then enable Remember User’s Path Preferences.

9.See Opportunity Stage History in Lightning Experience

Review changes to an opportunity’s amount, probability, stage, and close date on the Stage History related list in Lightning Experience. This change applies to Lightning Experience only.

The Opportunity Stage related list on an opportunity.

10.Show Who Reports to Whom from Contact Pages in Lightning Experience

Give your sales team a key tool for planning sales strategy. Use Lightning Contact Hierarchy to visualize the contacts on an account according to what sales reps enter in the Reports To field. Plus, customize contact hierarchy columns to show the information that’s most useful to your sales teams. This feature is new in Lightning Experience.

Give your sales reps access to the hierarchy from contact pages. In Setup, in the Salesforce1 and Lightning Experience Actions section of your contact page layout, add the View Contact Hierarchy action. The Actions menu includes the View Contact Hierarchy action unless you customized the contact page layout before Summer ’17.

contact_hierarchy_action

The hierarchy shows who reports to whom according to the Reports To field. Sales reps can expand or collapse areas as they navigate. They can view up to 2,000 contacts from each point where they enter a hierarchy. To view contacts in a different part of the hierarchy, a sales rep can enter the hierarchy from a different contact.

contact_hierarchy_action

Email Quote PDFs with One Click

In Lightning Experience, reps can now email one or more quote PDFs by clicking Email PDF in the Quote PDFs related list or list view. This change applies to Lightning Experience only.

11. Be More Productive with the Sales Console (Generally Available)

The Lightning Sales Console app is now generally available. Plus, it also benefits from all the great improvements we’ve made to all Lightning console apps, such as person account support, split view navigation, and keyboard shortcuts. These changes apply to Lightning Experience only.

208_sales_cloud_console.png

12.Lightning Voice: New Name, Call List General Availability, and Voicemail Drop

Lightning Voice has a new name and more call list features. Sales reps can also send pre-recorded voicemail messages and dial numbers in reports and dashboards. These changes apply to Lightning Experience only.

Organize Calls with a Call List (Generally Available)

To create a call list, reps can select the people they want to call, and click Add to Call List.

voice_call_list_select
The prioritized list appears in the call panel. In addition to leads, call lists also support accounts, person accounts, and contacts.

voice_call_list_panel
Reps can click Call Next to dial the number at the top of the list and open the related record. Only one call list is available at a time.

Send Prerecorded Voicemail Messages

Save time with custom voicemail messages. Reps can “drop” (or send) prerecorded messages to recipients’ voicemail boxes to focus their time on selling. This change applies to Lightning Experience only. To create a voicemail message, reps can select Voicemail Settings from the call panel or their personal settings.

voice_voicemail_record

13.Use Your Classic Email Templates in Lightning Experience

Leverage all the work and planning that went into your Salesforce Classic email templates by using the same templates in Lightning Experience. You can use your Text, Custom HTML, and Letterhead email templates in Lightning Experience. This change applies to Lightning Experience only.

When you insert an email template, change the filter to Classic Templates.

rn_sales_productivity_email_templates_CEX_in_LEX

14.Stay on Top of Things with the Updated Activity Timeline

Quickly see what each activity is about with easily read summaries. Need the details? Click Expand to see more, without leaving the timeline. Want to drill deeper into your day? Click Expand All to see all the details on all the activities in your timeline. This change applies to Lightning Experience only.
rn_sales_productivity_activity_timeline_annotated
You can expand each activity individually, or expand and collapse the entire list of activities at once. Expanded emails are shown just like they were sent, with paragraphs and line breaks in the same place. You can take actions from within the email summary, too.

rn_sales_productivity_activity_timeline_expanded_email

15.Home: Assistant and Performance Chart Updates

The Assistant has a new look, and the performance chart now has both a weekly and daily view. These changes apply to Lightning Experience only.

See Assistant Updates in a New Way

The Assistant has a slightly different look and feel. Click > to see more details about a specific update. This change applies to Lightning Experience only. Your sales reps can also quickly act on different updates with the new action buttons, such as sending an email or editing an opportunity.

home_assistant_revamp

See Multiple Views of the Performance Chart

The performance chart displays opportunities for the current sales quarter that are closed or open with a probability over 70%. Sales reps can now switch between a weekly and daily view. This change applies to Lightning Experience only.
home_performance_chart_view

16.Add Dashboard Filters in Lightning Experience

Add, edit, or remove filters from your Lightning Experience dashboard directly from the lightning dashboard builder. Filters let people choose different views of a dashboard, so one dashboard does the job of many. Without dashboard filters, you’d have to create multiple dashboards, each with its own set of filtered reports. For example, add a filter on the industry field to track opportunities by industry. This feature is new in Lightning Experience.

rd_dashboards_filter_add

17. Create Report and Dashboard Folders in Lightning Experience

Folders are key to sharing and organizing reports and dashboards. Now you can create them in Lightning Experience. Switch to Salesforce Classic to grant other people access to folders. This feature is new in Lightning Experience.

rd_reports_dashboards_folders_create

There are many more powerful features in Summer’17 Release notes. For complete list of Summer’17, Release Notes click here