cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
fs92
Level: Powered On

react list in model-driven app

Hi,

 

I want to build an empty model-driven app that contains a react component and PCF, connects to CDS and shows the data in a list in the first step. React will be used because of fabric UI.

I have built the App and used the official guidelines to deploy it.

Now I want to have only an empty model-driven app that contains my list in a first step.

 

I have several questions:

  1. Is this the right way to embed customized lists and other components that are interacting with CDS?
  2. Is there anywhere a guide on how to embed a react solution in the correct way?
  3. Do I have to declare it as a grid or subgrid in the manifest?

 

Cheers

FS

2 REPLIES 2
PowerApps Staff HemantG
PowerApps Staff

Re: react list in model-driven app

  • Is this the right way to embed customized lists and other components that are interacting with CDS?

Model driven app Navingation and command bars can be hidden using the navbar and cmdbar url paramers. See sample here 

You need to have the entity grid for which you are building the custom react customization as landing page which would result in visually showing only your component witout any model app shell like image below. You need to manage navigations from your custom PCF now as needed using APIs for navigation or open record item from grid.

 

Forum.png

  • Is there anywhere a guide on how to embed a react solution in the correct way?

React PCF controls can replace form feilds , grids , sub grids and associated grids at entity or record level. You can add these at entity and view level. Also CDS data set options in the control manifest can control what PCF can show - cds-data-set-options="displayCommandBar:true;displayViewSelector:true;displayQuickFindSearch:true"

See documentation here

  • Do I have to declare it as a grid or subgrid in the manifest?

If you are planning to take over the whole page , yes declaring it as a data set type controls and configuring it to landing page entity will do the trick. Note that this being PCF you have access to CDS data and also you can use setControlState API to locally cache stuff for faster reload. 

 

 

hemant

fs92
Level: Powered On

Re: react list in model-driven app

Hi HemantG,

 

what do you mean with the Landing Page? Is it the first Page of the model driven app for an Entity?

Or do you mean the new Portal Feature with Landing Page as Template?

edit:

I have now implemented as follows:

1. Uploaded the react solutions 

2. Added View to Entity

3. Added Custom Control as Grid to View

4. Created a new model-driven app

5. Added Entity to model-driven app

6. Added only the customized view to the entity/model-driven app...

 

I'm getting now the data of the entity grid to add it over my react solution.

For this I have logged: console.log(this._context.parameters.dataSetGrid);

which shows that items are available... How can I access a full dataset/row now??

 

Best regards

fs92

Helpful resources

Announcements
thirdimage

Power Automate Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

sixthImage

Power Platform World Tour

Find out where you can attend!

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

fifthimage

Microsoft Learn

Learn how to build the business apps that you need.

Top Kudoed Authors (Last 30 Days)
Users online (5,263)