MDS tech renovation

Automated semantic releases

We’ve introduced automated semantic releases and release notes generation. There’s no more waiting for a human to release a new version, it simply takes place upon merging a pull request. This will ensure that the versioning is consistent and that the release process is more efficient and less error-prone.

Individual package releases

Previously, we were only able to publish all core components as a part of one package mds-components-core. We’ve now introduced individual component package releases alongside the former approach. This means that you can include only the components you need as a top-level package and reduces the chance of including components you don’t need via side-effects. It will also reduce adoption barriers of potential subsequent major versions, minimizes risk, and save time for migration in future.

Additionally, this allows us to do alpha and beta releases for new components and features.

You can now import components using their own corresponding package names like this:

// Importing the mds-components-core works as normal
import "@maersk-global/mds-components-core";

// Using paths to import individual components is still possible, but not recommended
import "@maersk-global/mds-components-core/mc-button";

// New approach to import the mc-button component, include mds-components-core-button
import "@maersk-global/mds-components-core-button";

Aligning tech stack with Community UI and organization-wide

Having architected the Community UI’s code base and received positive feedback, MDS now utilizes the same toolchain and libraries as the community, including NX, Node.js 20, Storybook 8, and Lit 3. This alignment will facilitate collaboration, project transitions, and knowledge sharing.

Storybook enhancements

Storybook has transitioned to use Vite as its underlying build tool, moving away from its previous reliance on Webpack. This change has significantly enhanced performance, resulting in quicker build and run times and substantially reduces waiting time for developers.

Besides that, the code-preview pane is now integrated directly within the component story, enhancing its discoverability, accuracy, and visual prominence.

Streamlined maintenance

Thanks to NX, building, linting, and testing individual packages is more efficient, moving away from the previous method that necessitated a full build every time, and was time-consuming.

Furthermore, this enhances the developer experience for contributions. With a mature toolchain and an improved working environment, contributing to the MDS core gets easier and is a more rewarding experience for all developers.

Additionally, modifications to specific components, such as mds-components-utils, no longer require waiting for a rebuild to test in other components, further speeding up development.

Finally, the new setup’s automated code-preview generation will significantly streamline the delivery process, making documentation maintenance and updates more efficient and less tedious.

Enhanced and optimised CONTRIBUTING & README documentation

The upgrade has also enhanced the repo’s CONTRIBUTING and README documentation, consolidating them in a single location within the repository where they truly belong. This makes it easier for developers to find the guidance they need while contributing.