Creating an Aura Component for Use as an Action Override

1<aura:component 
2    implements="lightning:actionOverride,force:hasRecordId,force:hasSObjectName">
3    
4    <article class="slds-card">
5      <div class="slds-card__header slds-grid">
6        <header class="slds-media slds-media_center slds-has-flexi-truncate">
7          <div class="slds-media__body">
8            <h2><span class="slds-text-heading_small">Expense Details</span></h2>
9          </div>
10        </header>
11        <div class="slds-no-flex">
12            <lightning:button label="Edit" onclick="{!c.handleEdit}"/>
13        </div>
14      </div>
15      <div class="slds-card__body">(expense details go here)</div>
16    </article>
17</aura:component>

In Lightning Experience, the standard Tab and View actions display as a page, while the standard New and Edit actions display in an overlaid panel. When used as action overrides, Aura components that implement the lightning:actionOverride interface replace the standard behavior completely. However, overridden actions always display as a page, not as a panel. Your component displays without controls, except for the main Lightning Experience navigation bar. Your component is expected to provide a complete user interface for the action, including navigation or actions beyond the navigation bar.

One important difference from Visualforce that’s worth noting is how components are added to the Lightning component menu. The Visualforce page menu lists pages that either use the standard controller for the specific object, or that don’t use a standard controller at all. This filtering means that the menu options vary from object to object, and offer only pages that are specific to the object, or completely generic.

The Lightning component menu includes every component that implements the lightning:actionOverride interface. A component that implements lightning:actionOverride can’t restrict an admin to overriding only certain actions, or only for certain objects. We recommend that your organization adopt processes and component naming conventions to ensure that components are used to override only the intended actions on intended objects. Even so, it’s your responsibility as the component developer to ensure that components that implement the lightning:actionOverride interface gracefully respond to being used with any action on any object.