Implementer Tools UI - Project Plan

TaskPartsRelated workNotes

Backend module management tab


  • Basically just the existing backed modules page

Must / Easy

Create "Frontend modules" left nav


  • List frontend modules with pages at top; those with no pages under the break
  • Clicking a module should reveal its config in the right panel (not in designs)

Must / Easy

Configuration editor in right panel


  • Show configuration elements, appropriately formatted up to 1 level of nesting deep.
  • Show slot configurations.
  • Extensions should be draggable and deletable
  • Make config system warn about any schemas that have nesting more than one level deep
  • Flatten existing nested config schemas
Must / Medium

Make implementer tools wrap around the screen


  • Top bar with "UI editor" and "Module manager"
  • Left bar with Pages and Extensions buttons
  • Right bar with "Nothing selected'
  • Toggle between desktop and tablet view
  • Download button

Should / Hard

The design is really built around this, though it requires pretty brutal CSS hacks.

We may end up deciding to keep the current bottom-drawer style.

Create "Pages" navigation scheme


  • Allow access even to pages that have dynamic URL parts
  • Create a new way of defining pages that gives app shell access to their featureName
  • Include modules with no pages (Styleguide, API) under a line break
  • Split Login page into separate Login and Location pages
  • Ensure all page featureNames are nice
Must / Medium

Create sub-pages navigation scheme


  • Have core manage the left nav. It could produce the left nav as an extension which the patient chart simply plugs in to a slot.
  • Slots should support setting configurable={false}  for examples like this left nav extension.
Must / Hard

Array of objects modal editor


  • Config elements which have "array of object" type should bring up a modal for adding a new element
  • Config elements which have "freeform object" type should bring up the same modal, and show "key" as a field name in the modal.
  • Patient chart should support adding dashboards via config
Must / Easy

Create "View connections" modal from "Frontend modules" view

Design (and next screen)

  • Clicking "View connections" brings up modal showing the frontend module's Pages
  • "View connections" should not appear for any frontend module which has no pages
  • Clicking a page jumps to that page in the implementer tools "Pages" navigation

Could / Easy

Add extension modal


  • Modal that lists extensions that can be added
  • Extensions should have descriptions
  • Search bar that filters list of extensions
  • Extensions and slots should have "types"
Must / Medium
Edit extension config
  • Clicking the "edit" button on an extension should open the configuration in the right pane for that extension specifically
  • The extension should have a purple border in the UI when its configuration is open in the right pane
  • Extensions should be able to tell the app shell what subset of the module config schema they use
Must / Medium

Concepts tab of configuration pane


  • If a config schema has a top-level element "concepts," its contents are shown in the "Concepts" tab, separate from the rest of the config

Should / Easy

Add extension from template

Design and next 3 screens

  • If templates are available for the Type of the selected slot, a "Create extension from template" link should appear
  • Add app shell support for "templates." These are registered like extensions, but under a "templates" key in setupOpenMRS , and they also get added to a registry of templates, which probably can be managed by esm-extensions.
  • Implement "select a template" modal
  • Implement "customize your <template name>" modal
  • Create registerTemplateConfig  that allows templates to register schemas that do not have defaults for everything.

Could / Hard