Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Feature request: host code apps inside model-driven apps (navigation, form tab/section, command dialogs), like custom pages

Chiusa
  • Qualcosa non va?
#508 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
25/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
frontend, full-stack

Direzione di ricerca

Start by reading how code apps currently receive host context through getContext() from @microsoft/power-apps/app, then compare that flow with the custom page integration points described in the issue. The request spans app navigation, form hosting, command navigation, authentication, and close/result behavior. Done means code apps can be hosted in all three places with authentication and record context passed through.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

bug
Summary

Custom pages can be used inside a model-driven app: as a page in the app's navigation, on a form, and as a dialog or side pane opened from a command. The model-driven app passes the user's authentication and the context (table, record id) to the page. Code apps can't do any of this today: they only run standalone in the Power Apps player.

Please let code apps be hosted by a model-driven app in the same three ways as custom pages, with the authentication and the context passed by the model-driven app:

  1. A code app as a page in the model-driven app: a code app in the app's site map (navigation), like a custom page, added in the app designer (Add page → Code app).
  2. A code app inside a form: in a form tab or section, with the current record passed to it (table + record id). This now can be done with a Canvas App - and with some out-of-the-box thinking with a page -
  3. A code app opened from a command: e.g. replacing the classic New / Edit buttons, as a dialog, side pane or full page (Xrm.Navigation.navigateTo), like a custom page can.

For all three: the model-driven app passes the authentication to the code app, just as it does for a custom page: no second sign-in, no extra consent, no separate player session.

Below a screenshot of the Model Driven App add Page option:
Image

Why
  • Code apps are the pro-code way to build rich UI on Dataverse (React, TypeScript, any UI library, tests, ALM in git). Many solutions combine a model-driven app (data maintenance, admin, views, business process) with focused screens for specific steps of a process. Today those screens have to be custom pages (low-code) or a separate code app the user opens in another tab.
  • Users expect one app: a focused screen should open where the user works — in the navigation, on the record's form, or from the command bar — not as a separate app with its own header, sign-in and navigation.
  • Replacing the classic New / Edit experience of a table with a guided code app screen (a wizard, a responsive form for the phone) is a common need. With custom pages this works (navigateTo with pageType: "custom"); with code apps it doesn't.
  • Code apps already run in a host (the player) that passes the user's context (getContext() from @microsoft/power-apps/app). The same model would work when the host is a model-driven app.
How it could work (suggestion)
Custom page today Code app (requested)
In the navigation Site map subarea / app designer Add page → Custom page Add page → Code app; the code app as an app module component
On a form A custom page in a form tab / section, record context passed A code app component in a form tab / section; getContext() returns the table and record id
From Legacy Buttons Xrm.Navigation.navigateTo({ pageType: "custom", name, entityName, recordId }, { target: 2, position: 1 / 2 })
Scott Durow approach:
https://www.youtube.com/watch?v=99uU5gGN15w		 navigateTo({ pageType: "codeapp", name, entityName, recordId, data }, { target: 1 / 2, position }) — full page, dialog or side pane
From a command Xrm.Navigation.navigateTo({ pageType: "custom", name, entityName, recordId }, { target: 2, position: 1 / 2 }) navigateTo({ pageType: "codeapp", name, entityName, recordId, data }, { target: 1 / 2, position }) — full page, dialog or side pane
Authentication Passed by the model-driven app Passed by the model-driven app — the code app's data sources and connections work without a new sign-in
Context in the app Param() in Power Fx
@ModelDrivenIntegration in Canvas or Page		 getContext() extended, e.g. host: "modelDrivenApp", appId, entityName, recordId, formType, custom data
Closing / result Back(), close the dialog An API to close the dialog / side pane and return a result (e.g. the new record id) so the form or view refreshes

Bonus: when a code app is shown inside a model-driven app, its own header is hidden automatically (the model-driven app's header is enough).

Additional Consideration

Yes I am aware that we can use custom components to add functionality to a dataverse form. But in my opinion it would make sense to streamline the experience over multiple usecases, therefor it would make sense to enable CodeApps to host the integration options of the Custom page, so it can be used in a wide area of usecases.

With adding this feature we as consultants and developers get extended choices on how to implement functionality. We can decide to go full low code - canvas apps and pages -, full pro code - with codeapps and (optional) custom components - or hybrid - all types based on the specific usecase -. This makes sense I hope.

Environment
  • Power Apps CLI pa 1.3.0, @microsoft/power-apps 1.5.0.
  • Code apps in a solution together with a model-driven app (unmanaged in dev, managed in test / production).
  • Today the only way to show a code app from a model-driven app is a link that opens it standalone in the player (a new tab, its own header and navigation, no record context except through URL parameters).
Lingua principale
TypeScript
Stelle
516
Fork
145
Merge medio
1g 10h
PR unite (30g)
23

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di microsoft/PowerAppsCodeApps

Tutte le issue di microsoft/PowerAppsCodeApps

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.