Live publish

Author: buck1ey

powerapps-docs/developer/model-driven-apps/clientapi/navigate-to-custom-page-examples.md

@@ -1,8 +1,7 @@
 ---
 title: "Navigating to and from a custom page in your model-driven app using client API (preview)" 
-description: "This article provides examples of navigating from a model-driven app page using the Client API to a custom page."
-ms.custom: ""
-ms.date: 07/21/2021
+description: "This article provides examples of navigating from a model-driven app page using the client API to a custom page."
+ms.date: 08/17/2021
 ms.reviewer: ""
 ms.service: powerapps
 ms.subservice: mda-developer
@@ -24,7 +23,7 @@ search.app:
 
 This article provides examples of navigating from a model-driven app page to a custom page using [Client API](../client-scripting.md). This article also includes examples of navigating from a custom page to other custom pages and also from custom page to model-driven app form.
 
-This article outlines the steps to use Client API to open a custom page as a full-page, dialog, or pane.  It provides examples of **custom** as a `pageType` value in [navigateTo (Client API reference)](reference/xrm-navigation/navigateto.md).
+This article outlines the steps to use client API to open a custom page as a full-page, dialog, or pane.  It provides examples of **custom** as a `pageType` value in [navigateTo (Client API reference)](reference/xrm-navigation/navigateto.md).
 
   > [!IMPORTANT]
   > - This is a preview feature, and isn't available in all regions.
@@ -35,13 +34,13 @@ This article outlines the steps to use Client API to open a custom page as a ful
 
 ### Finding the logical name
 
-Each of the following Client API examples takes the logical name of the custom page as the required parameter. The logical name is the **Name** value of the page in the solution explorer. 
+Each of the following client API examples takes the logical name of the custom page as the required parameter. The logical name is the **Name** value of the page in the solution explorer. 
 
 :::image type="content" source="../../../maker/model-driven-apps/media/navigate-page-examples/find-page-logical-name.png" alt-text="Find page logical name." lightbox="../../../maker/model-driven-apps/media/navigate-page-examples/find-page-logical-name.png":::
 
 ### Open as an inline full page without context
 
-Within a model-driven app Client API event handler, call the following code and update the **name** parameter to be the logical name of the page.
+Within a model-driven app client API event handler, call the following code and update the **name** parameter to be the logical name of the page.
 
 ```javascript
 // Inline Page
@@ -93,7 +92,7 @@ Xrm.Navigation.navigateTo(pageInput, navigationOptions)
 
 ### Open as a centered dialog
 
-Within a model-driven app Client API event handler, call the following code and update the **name** parameter to be the logical name of the custom page.  This mode supports the sizing parameters similar to the [Main form dialogs](../../../developer/model-driven-apps/customize-entity-forms.md#open-main-form-in-a-dialog-using-client-api).
+Within a model-driven app client API event handler, call the following code and update the **name** parameter to be the logical name of the custom page.  This mode supports the sizing parameters similar to the [Main form dialogs](../../../developer/model-driven-apps/customize-entity-forms.md#open-main-form-in-a-dialog-using-client-api).
 
 ```javascript
 // Centered Dialog
@@ -121,7 +120,7 @@ Xrm.Navigation.navigateTo(pageInput, navigationOptions)
 
 ### Open as a side dialog
 
-Within a model-driven app Client API event handler, call the following code and update the **name** parameter to be the logical name of the custom page.
+Within a model-driven app client API event handler, call the following code and update the **name** parameter to be the logical name of the custom page.
 
 ```javascript
 // Side Dialog
@@ -201,7 +200,66 @@ This example uses the `recordId` parameter within the [navigateTo](reference/Xrm
     ```
 
     > [!NOTE]
-    > After changing the `OnStart` property, you'll need to run `OnStart` from the App context menu. This function runs only once within a session.
+    > After changing the `OnStart` property, you'll need to run `OnStart` from the App context menu. This function performs only once within a session.
+
+1. Then, the custom page can use the **RecordItem** parameter as a record. Below is an example on how to use it in an [EditForm](../../../maker/canvas-apps/functions/function-form.md).
+
+    ```powerappsfl
+    EditForm.Datasource=<datasource name>
+    EditForm.Item=RecordItem
+    ```
+
+### Open from a selected record in editable grid as a centered dialog with record ID
+
+Editable grid can be used to trigger [OnRecordSelect](reference/events/grid-onrecordselect.md) event for scenarios where you want to perform an action when a particular record is selected in a view. This example uses the `recordId` parameter within the [navigateTo](reference/Xrm-Navigation/navigateTo.md) function to provide the custom page with the record to use. The record ID is retrieved using the `getId` method in [GridEntity](reference/grids/gridentity.md) object. The `Param` function within the custom page retrieves the value and uses the lookup function to retrieve the record. 
+
+1. [Enable editable grid](../../../developer/model-driven-apps/use-editable-grids.md) control in the table.
+
+1. Create a web resource of type **JScript** and update the **name** parameter to be the logical page name. Add the following code to the web resource.
+
+    ```javascript
+    function RunOnSelected(executionContext) {
+    // Retrieves the record selected in the editable grid
+    var selectedRecord = executionContext.getFormContext().data.entity;
+    var Id = selectedRecord.getId().replace(/[{}]/g, ""); 
+
+    // Centered Dialog
+    var pageInput = {
+        pageType: "custom",
+        name: "<logical page name>",
+        recordId: Id,
+    };
+    var navigationOptions = {
+        target: 2,
+        position: 1,
+        width: { value: 50, unit: "%" },
+        title: "<dialog title>"
+    };
+    Xrm.Navigation.navigateTo(pageInput, navigationOptions)
+        .then(
+            function () {
+                // Called when the dialog closes
+            }
+        ).catch(
+            function (error) {
+                // Handle error
+            }
+        );
+     }
+    ```
+
+1. In the custom page, override the **App**'s **OnStart** property to use the `Param` function to get the `recordId` and lookup record.
+
+    ```powerappsfl
+    App.OnStart=Set(RecordItem, 
+        If(IsBlank(Param("recordId")),
+            First(<entity>),
+            LookUp(<entity>, <entityIdField> = GUID(Param("recordId"))))
+        )
+    ```
+
+    > [!NOTE]
+    > After changing the `OnStart` property, you'll need to run `OnStart` from the App context menu. This function performs only once within a session.
 
 1. Then, the custom page can use the **RecordItem** parameter as a record. Below is how to use it in an [EditForm](../../../maker/canvas-apps/functions/function-form.md).
 
@@ -225,5 +283,5 @@ This example uses the `recordId` parameter within the [navigateTo](reference/Xrm
 
 [Add a custom page to your model-driven app](../../../maker/model-driven-apps/add-page-to-model-app.md)
 
-[navigateTo (Client API reference)](reference/xrm-navigation/navigateto.md)
+[navigateTo (client API reference)](reference/xrm-navigation/navigateto.md)
 

powerapps-docs/maker/TOC.yml

@@ -2261,6 +2261,8 @@
           href: ../teams/when-create-teams-apps.md
         - name: Add notifications to make your apps collaborative
           href: ../teams/add-app-notifications.md
+        - name: Enable consistent experience across sessions
+          href: ../teams/consistent-experience-across-sessions.md
     - name: Manage your apps
       href: ../teams/manage-your-apps.md
     - name: Set permission and share your app

powerapps-docs/maker/canvas-apps/create-component.md

@@ -5,7 +5,7 @@ author: hemantgaur
 ms.service: powerapps
 ms.subservice: canvas-developer
 ms.topic: article
-ms.date: 07/01/2021
+ms.date: 08/18/2021
 ms.author: hemantg
 ms.reviewer: tapanm
 search.audienceType:
@@ -15,6 +15,7 @@ search.app:
 contributors:
   - hemantgaur
   - tapanm-msft
+  - gregli-msft
 ---
 
 # Create a component for canvas apps
@@ -45,13 +46,6 @@ Components available inside the app are listed under the **Custom** category in
 > [!NOTE]
 > Components discussed in this article are different from the Power Apps component framework that enables developers and makers to create code components for model-driven and canvas apps. For more information, go to [Power Apps component framework overview](../../developer/component-framework/overview.md).
 
-## Scope
-
-Think of a component as an encapsulated black box with properties as the interface. You can't access controls in the component from outside of the component. And you can't refer to anything outside of the component from inside the component. The exception is data sources shared between an app and its components. Scope restrictions keep the data contract of a component simple and cohesive, and it helps enable component-definition updates, especially across apps with component libraries. You can update the data contract of the component by creating one or more custom properties.
-
-> [!NOTE]
-> You can insert instances of components into a screen within a component library, and preview that screen for testing purposes. Also, note that the component library does not display when using [Power Apps Mobile](https://powerapps.microsoft.com/downloads/).
-
 ## Custom properties
 
 A component can receive input values and emit data if you create one or more custom properties. These scenarios are advanced and require you to understand [formulas](formula-reference.md) and binding contracts.
@@ -187,6 +181,31 @@ So far, you've created a component and added it to an app. Next, you'll create a
 
     The **Label** control reflects the menu item that you selected most recently.
 
+## Scope
+
+Input and output properties clearly define the interface between a component and its host app.  By default, the component is encapsulated so that it's easier to reuse the component across apps, requiring the use of the properties to pass the information in and out of the component. Scope restrictions keep the data contract of a component simple and cohesive, and it helps enable component-definition updates—especially across apps with component libraries.
+
+But there are times when a component may want to share a data source or a variable with its host. Especially when the component is only intended for use in one particular app. For these cases, you can directly access app level information by turning on the **Access app scope** switch in the component's property pane:
+
+![Access app scope switch in component property pane](media/create-component/access-app-scope.png)
+
+When **Access app scope** is turned on, the following are accessible from within a component:
+
+- Global variables
+- Collections
+- Controls and components on screens, such as a TextInput control
+- Tabular data sources, such as Dataverse tables
+
+When this setting is turned Off, none of the above are available to the component. [**Set**](functions/function-set.md) and [**Collect**](functions/function-clear-collect-clearcollect.md) functions are still available but the resulting variables and collections are scoped to the component instance and not shared with the app.
+
+Non-tabular data sources, such as Azure Blob Storage or a custom connector, are available whether this setting is turned on or off. Think of these data sources more like referencing an environment resource rather than an app resource. When a component is brought into an app from a component library, these data sources from the environment are also brought in.
+
+Components in a component library can never have access to app scope, as there's no single app scope to refer to. So, this setting isn't available in this context, and is effectively off. Once imported into an app, and if customization was allowed by the component maker, the switch can be enabled, and the component can be modified to use the app scope.
+
+> [!NOTE]
+> - You can insert instances of components into a screen within a component library, and preview that screen for testing purposes.
+> - Component library doesn't display when using [Power Apps Mobile](https://powerapps.microsoft.com/downloads/).
+
 ## Import and export components
 
 > [!NOTE]
@@ -249,7 +268,7 @@ Once you save the app, you can reuse the components of this app using the same m
 ## Known limitations
 
 - You can't save data sources, forms, and data tables with components.
-- Collections in components are not supported.
+- Collections in components aren't supported.
 - You can't insert a component into a gallery or a form.
 - A master instance of a component is a local master and scoped to the app. If you change a master instance, only copies of the component within the app will reflect the change. Copies in other apps will remain the same unless you import the component library again. All master instances in those apps will be automatically detected and updated.
 - You can't package media files when you import a component.

powerapps-docs/maker/canvas-apps/media/create-component/access-app-scope.png

@@ -91,7 +91,8 @@ Sending an email from Power Apps directly is faster for experienced makers, but
 
 - [Boards (Preview) sample app](boards.md)
 - [Bulletins sample app](bulletins.md)
-- [Employee ideas sample app](employee-ideas.md)  
+- [Employee ideas sample app](employee-ideas.md)
+- [Get connected (Preview)](get-connected.md)  
 - [Inspection sample apps](inspection.md)  
 - [Issue reporting sample apps](issue-reporting.md)
 - [Milestones sample app](milestones.md)