Michael Bromley dcdd05b8cf feat(admin-ui): Persist Collection list filter term to the url %!s(int64=3) %!d(string=hai) anos
..
e2e 38e94590dc refactor(admin-ui): Move admin-ui into packages dir %!s(int64=6) %!d(string=hai) anos
scripts 68107d28eb feat(admin-ui): Enable theming by use of css custom properties %!s(int64=5) %!d(string=hai) anos
src dcdd05b8cf feat(admin-ui): Persist Collection list filter term to the url %!s(int64=3) %!d(string=hai) anos
.gitignore fe72c41e7c feat(admin-ui): Improved ui extension development API & architecture %!s(int64=5) %!d(string=hai) anos
.npmignore 1622b146d7 refactor(admin-ui): Split admin ui into library of sub-packages %!s(int64=5) %!d(string=hai) anos
README.md 9e5932f836 chore(admin-ui): Generate json report for i18n coverage %!s(int64=5) %!d(string=hai) anos
angular.json a30d6399df fix(admin-ui): Remove deprecated showCircularDependencies option %!s(int64=4) %!d(string=hai) anos
i18n-coverage.json ba6c64a115 feat(admin-ui): Add live preview of Collection filter changes %!s(int64=3) %!d(string=hai) anos
package.json 8b72fb60f2 chore: Publish v1.5.2 %!s(int64=3) %!d(string=hai) anos
tsconfig.json d9c89f4a06 chore(admin-ui): Update to Angular v12.2, Clarity v5.5 %!s(int64=4) %!d(string=hai) anos
tsconfig.lib.json 5b8281d5e5 chore(admin-ui): Update to Angular v11 %!s(int64=4) %!d(string=hai) anos
tsconfig.lib.prod.json 5b8281d5e5 chore(admin-ui): Update to Angular v11 %!s(int64=4) %!d(string=hai) anos
tslint.json bc35c2517b feat(admin-ui): Update Angular to v9 %!s(int64=5) %!d(string=hai) anos

README.md

Vendure Admin UI

This is the administration interface for Vendure.

It is an Angular application built with the Angular CLI.

The UI is powered by the Clarity Design System.

Structure

Library

The Admin UI is structured as an Angular library conforming to the ng-packagr format. This library is what is published to npm as @vendure/admin-ui. The libary consists of a set of modules which are accessible from consuming applications as sub-packages:

  • @vendure/admin-ui/core
  • @vendure/admin-ui/catalog
  • @vendure/admin-ui/orders

etc. These library packages are located at ./src/lib

When built with yarn build, the output will be located in the ./package sub directory. This is also the root of the published npm package.

Application

In addition to the library, there is also a full application located at ./src/app. This application is used both during development of the Admin UI, and also as the "default" Admin UI without any UI extensions, as provided as the default by the admin-ui-plugin.

Localization

Localization of UI strings is handled by ngx-translate. The translation strings should use the ICU MessageFormat.

Translation keys are automatically extracted by running:

yarn extract-translations

This scan the source files for any translation keys, and add them to each of the translation files located in ./src/lib/static/i18n-messages/.

A report is generated for each language detailing what percentage of the translation tokens are translated into that language:

Extracting translation tokens for "src\lib\static\i18n-messages\de.json"
de: 592 of 650 tokens translated (91%)

This report data is also saved to the i18n-coverage.json file.

To add support for a new language, create a new empty json file ({}) in the i18n-messages directory named <languageCode>.json, where languageCode is one of the supported codes as given in the LanguageCode enum type, then run yarn extract-translations