Skip to content

Commit

Permalink
refactor(dsm): removes invision dsm
Browse files Browse the repository at this point in the history
We have decided to remove Invision DSM and opt for a more manual process of linking examples. The
DSM package had a very large dependency tree which was prone to vulnerabilities, these were rarely
fixed within an appropriate timeframe. It also forced us into specific versions of dependences and
at times held us back from upgrading Storybook.

fix #238
  • Loading branch information
andy-polhill committed Mar 15, 2021
1 parent d035439 commit e5b5a53
Show file tree
Hide file tree
Showing 32 changed files with 34 additions and 1,113 deletions.
7 changes: 0 additions & 7 deletions .dsmrc

This file was deleted.

1 change: 0 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@ storybook-static

# dependencies
node_modules/
/.dsm

# profiling files
chrome-profiler-events.json
Expand Down
3 changes: 0 additions & 3 deletions .storybook/addons.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,9 @@ import '@storybook/addon-backgrounds/register';
import '@storybook/addon-viewport/register';
import '@storybook/addon-a11y/register';
import '@storybook/addon-storysource/register';
import { registerDsm } from '@invisionapp/dsm-storybook/register';
import { addons } from '@storybook/addons';
import canopyTheme from './canopy-theme';

addons.setConfig({
theme: canopyTheme,
});

registerDsm(process.env.STORYBOOK_DSM);
13 changes: 3 additions & 10 deletions .storybook/config.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import { initDsm } from '@invisionapp/dsm-storybook';
import { addDecorator, addParameters, configure } from '@storybook/angular';
import { withA11y } from '@storybook/addon-a11y';
import cssVars from 'css-vars-ponyfill';
Expand All @@ -20,12 +19,6 @@ cssVars({
addParameters({ docs: { page: null } });
addDecorator(withA11y);

//Init Dsm
initDsm({
addDecorator,
addParameters,
callback: () => {
require('!style-loader!css-loader!sass-loader!../projects/canopy/src/styles/styles.scss');
configure(require.context('../projects/canopy', true, /\.stories\.ts$/), module);
},
});
require('!style-loader!css-loader!sass-loader!../projects/canopy/src/styles/styles.scss');
configure(require.context('../projects/canopy', true, /\.stories\.ts$/), module);

12 changes: 0 additions & 12 deletions docs/CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -104,18 +104,6 @@ Code Owners are chosen based on a history of consistent contributions. Code Owne

The build is currently handled by [Github Actions](https://help.github.com/en/actions), the config for which is checked into the [.github](./.github) directory. The build will run on every pull request and run standard verification tasks e.g. linting, unit testing, test build. The build will need to be green in order for a pull request to pass.

## InVision DSM

To ensure the Canopy implementation keeps in sync with the design expectations we use the [InVision Design System Manager](https://legalandgeneral.invisionapp.com/dsm/legalandgeneral/canopy). InVision DSM has a storybook integration which allows us to publish stories directly to the DSM interface, this helps us to keep the design and implementation in sync.

Each time a merge is made to the master branch we run the `dsm-storybook publish` command from GitHub actions, this publishes the latest change to DSM. Some additional markup is required to link a story to it's corresponding DSM page, for comprehensive instructions refer to the [InVision DSM Storybook documentation](https://support.invisionapp.com/hc/en-us/articles/360028510211-Configuring-the-Storybook-DSM-Integration). In the majority of cases it should be as simple as adding an Angular code tab to the relevant DSM page, you will then be provided with an ID that can be added to the config of the story.

```js
'in-dsm': {
id: '5ec4dbf0c4b3aed7e94e8886'
},
```

## SVG Icons

To add a new SVG icon to Canopy simply add the file to either the `icons` or `brand-icons` folder within `assets`.
Expand Down
Loading

0 comments on commit e5b5a53

Please sign in to comment.