Skip to content

A .NET Core based, WebView2 using UI Container for hybrid web-desktop applications

License

Notifications You must be signed in to change notification settings

morganstanley/ComposeUI

ComposeUI

Lifecycle Incubating Build Status NPM NuGet OpenSSF Scorecard codecov GitHub Repo stars

ComposeUI is a A .NET Core based general UI Container and Unified UI and App host which enables the hosting of Web and desktop content.

Our goal is to fill the feature gaps with respect to UI components, layout management, and subpar native hosting in other industry container solutions by providing a standard container as an open desktop platform. It is a hybrid solution that meets the needs of a diverse application catalog as well as a compelling opensource alternative.

It supports desktop and web applications in order to provide an evergreen alternative to Electron, OpenFin and similar by the use of WebView2.

Releases

@morgan-stanley/composeui-node-launcher

npm

Development Setup

Prerequisites

  • Node.js 18
  • .NET 6
  • Visual Studio: 2022

Building the dependencies with Lerna

The javascript dependencies are managed by a lerna monorepo. To build them separately follow the steps below.

Run scripts

In the root folder

npm i

Build all modules:

npx lerna run build --stream

Test all modules:

npx lerna run test --stream

(If you don't want a detailed log, you can execute these without --stream)

Building a specific module:

npx lerna run build --stream --scope=@morgan-stanley/composeui-messaging-client

List all modules in the workspace

npx lerna list

Docs

For more information check the documentation.

Building the Experimental Artifacts

The following steps are for building the experimental artifacts and shell for ComposeUI

Clone the main repository:

git clone https://github.com/morganstanley/ComposeUI.git

Terminal

Building Nuget and NPM packages

Open Powershell in the ComposeUI folder.

Restore nuget packages:

PS C:\projects\ComposeUI> .\build\dotnet-restore.ps1

Build .NET solutions:

PS C:\projects\ComposeUI> .\build\dotnet-build.ps1

Build javascript (with Lerna)

PS C:\projects\ComposeUI> .\build\lerna-build.ps1

Now the necessary artifacts have been built.

Building the Examples

FDC3 Chart and Grid Example

From the ComposeUI folder:

.\examples\fdc3-chart-and-grid\serve-chart-and-grid.ps1

Now the development servers are running:

  • Chart: localhost:8080
  • Grid: localhost:4200

Launching the Shell with the Examples

  1. It's recommended to add the shell binary to your PATH environment variable so you can use a shorthand:
cd .src\shell\dotnet\
.\add-to-path.ps1
  1. Launch the FDC3 Example in the ComposeUI Shell:
MorganStanley.ComposeUI.Shell --ModuleCatalog:CatalogUrl file:///C:/ComposeUI/src/Shell/dotnet/examples/module-catalog.json --FDC3:AppDirectory:Source C:/ComposeUI/examples/fdc3-appdirectory/apps-with-intents.json

Visual Studio

Similar steps can be taken in Visual Studio to have the same affect. See Prerequisites

Building Solutions

For the FDC3 Samples

The necessary solutions have to be built in the following order:

  1. Message Router
  2. ModuleLoader
  3. DesktopAgent
  4. AppDirectory
  5. Shell

Serving web application

See FDC3 Chart and Grid Example

Running the Shell

  1. Open the Shell Solution
  2. Choose "Shell" as the startup project
  3. Run