remove storybook: (#15074)

* remove storybook:

* changelog

* clean up

* update browserstack

* remove special case for storybook

* add back gen-story-md

CONTRIBUTING.md

@@ -119,14 +119,12 @@ is optional but encouraged.
 Bug fixes are welcome in PRs but existing tests must pass and updated logic 
 should be handled in new tests. You needn't submit an issue first to fix bugs.
 
-Keep in mind that the UI should be consistent with other areas of Vault. Our 
-[README](ui/README.md) [has instructions for launching Storybook](ui/README.md#vault-storybook),
-which showcases how we use components. Beyond that, the UI should be user-centered, 
-informative, and include edge cases and errors— including accommodations for 
-users who may not have permissions to view or interact with your feature. 
-If you are not comfortable with UI design, a Vault designer can take a look at 
-your work— just be aware that this might mean it will add some time to the 
-PR process. 
+Keep in mind that the UI should be consistent with other areas of Vault. 
+The UI should be user-centered, informative, and include edge cases and errors— 
+including accommodations for users who may not have permissions to view or 
+interact with your feature. If you are not comfortable with UI design, a Vault
+designer can take a look at your work— just be aware that this might mean 
+it will add some time to the PR process. 
 
 Finally, in your code, try to avoid logic-heavy templates (when possible, 
 calculate values in the .js file instead of .hbs) and Ember anti-patterns. 

changelog/15074.txt

@@ -0,0 +1,3 @@
+```release-note:improvement
+ui: Remove storybook.
+```

ui/.eslintignore

@@ -9,10 +9,7 @@
 # dependencies
 /bower_components/
 /node_modules/
-/.storybook/
 /.yarn/
-/stories/
-/storybook-static/
 
 # misc
 /coverage/

ui/.gitignore

@@ -3,7 +3,6 @@
 # compiled output
 /dist/
 /tmp/
-/storybook-static/
 
 # dependencies
 /bower_components/
@@ -18,7 +17,6 @@
 /npm-debug.log*
 /testem.log
 /yarn-error.log
-/.storybook/preview-head.html
 package-lock.json
 
 # ember-try

ui/README.md

@@ -12,12 +12,6 @@
  - [Running Browserstack Locally](#running-browserstack-locally)
  - [Linting](#linting)
  - [Building Vault UI into a Vault Binary](#building-vault-ui-into-a-vault-binary)
- - [Vault Storybook](#vault-storybook)
- - [Storybook Commands at a Glance](#storybook-commands-at-a-glance)
- - [Writing Stories](#writing-stories)
- - [Adding a new story](#adding-a-new-story)
- - [Code Generators](#code-generators-1)
- - [Storybook Deployment](#storybook-deployment)
  - [Further Reading / Useful Links](#further-reading--useful-links)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
@@ -142,102 +136,11 @@ This will result in a Vault binary that has the UI built-in - though in
 a non-dev setup it will still need to be enabled via the `ui` config or
 setting `VAULT_UI` environment variable.
 
-## Vault Storybook
-
-The Vault UI uses Storybook to catalog all of its components. Below are details for running and contributing to Storybook.
-
-### Storybook Commands at a Glance
-
-| Command | Description |
-| ------------------------------------------------------------------------ | ---------------------------------------------------------- |
-| `yarn storybook` | run storybook |
-| `ember generate story [name-of-component]` | generate a new story |
-| `ember generate story [name-of-component] -ir [name-of-engine-or-addon]` | generate a new story in the specified engine or addon |
-| `yarn gen-story-md [name-of-component]` | update a story notes file |
-| `yarn gen-story-md [name-of-component] [name-of-engine-or-addon]` | update a story notes file in the specified engine or addon |
-
-### Writing Stories
-
-Each component in `vault/ui/app/components` should have a corresponding `[component-name].stories.js` and `[component-name].md` files within `vault/ui/stories`. Components in the `core` addon located at `vault/ui/lib/core/addon/components` have corresponding stories and markdown files in `vault/ui/lib/core/stories`.
-
-#### Adding a new story
-
-1. Make sure the component is well-documented using [jsdoc](https://usejsdoc.org/tags-exports.html). This documentation should at minimum include the module name, an example of usage, and the params passed into the handlebars template. For example, here is how we document the ToggleButton Component:
-
-````js
-/**
- * @module ToggleButton
- * `ToggleButton` components are used to expand and collapse content with a toggle.
- *
- * @example
- * ```js
- * <ToggleButton @openLabel="Encrypt Output with PGP" @closedLabel="Encrypt Output with PGP" @toggleTarget={{this}} @toggleAttr="showOptions"/>
- * {{#if showOptions}}
- * <div>
- * <p>
- * I will be toggled!
- * </p>
- * </div>
- * {{/if}}
- * ```
- *
- * @param {String} toggleAttr=null - The attribute upon which to toggle.
- * @param {Object} attrTarget=null - The target upon which the event handler should be added.
- * @param {String} [openLabel=Hide options] - The message to display when the toggle is open. //optional params are denoted by square brackets
- * @param {String} [closedLabel=More options] - The message to display when the toggle is closed.
- */
-````
-
-Note that placing a param inside brackets (e.g. `[closedLabel=More options]` indicates it is optional and has a default value of `'More options'`.)
-
-2. Generate a new story with `ember generate story [name-of-component]`
-3. Inside the newly generated `stories` file, add at least one example of the component. If the component should be interactive, enable the [Storybook Knobs addon](https://github.com/storybooks/storybook/tree/master/addons/knobs).
-4. Generate the `notes` file for the component with `yarn gen-story-md [name-of-component] [name-of-engine-or-addon]` (e.g. `yarn gen-md alert-banner core`). This will generate markdown documentation of the component and place it at `vault/ui/stories/[name-of-component].md`. If your component is a template-only component, you will need to manually create the markdown file. The markdown file will need to be imported in your `[component-name].stories.js` file (e.g. `import notes from './[name-of-component].md'`).
-5. The completed `[component-name].stories.js` file should look something like this (with knobs):
-
-```js
-import hbs from 'htmlbars-inline-precompile';
-import { storiesOf } from '@storybook/ember';
-import { text, withKnobs } from '@storybook/addon-knobs';
-import notes from './stat-text.md';
-
-storiesOf('MyComponent', module)
- .addParameters({ options: { showPanel: true } })
- .addDecorator(withKnobs())
- .add(
- `MyComponent`,
- () => ({
- template: hbs`
- <h5 class="title is-5">My Component</h5>
- <MyComponent @param={{param}} @anotherParam={{anotherParam}} />
- `,
- context: {
- param: text('param', 'My parameter'),
- anotherParam: boolean('anotherParam', true),
- },
- }),
- { notes }
- );
-```
-
-See the [Storybook Docs](https://storybook.js.org/docs/basics/introduction/) for more information on writing stories.
-
-### Code Generators
-
-It is important to add all new components into Storybook and to keep the story and notes files up to date. To ease the process of creating and updating stories please use the code generators using the [commands listed above](#storybook-commands-at-a-glance).
-
-### Storybook Deployment
-
-A Vercel integration deploys a static Storybook build for any PR on the Vault GitHub repo. A preview link will show up in the PR checks. Once items are merged, the auto-deployed integration will publish that build making it available at [https://vault-storybook.vercel.app](https://vault-storybook.vercel.app). Currently the Vercel integration will cd into the `ui/` directory and then run `yarn deploy:storybook` so troubleshooting any issues can be done locally by running this same command. The logs for this build are public and will be linked from the PR checks.
-
 ## Further Reading / Useful Links
 
 - [ember.js](https://emberjs.com/)
 - [ember-cli](https://ember-cli.com/)
 - Development Browser Extensions
  - [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
  - [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/)
-- [Storybook for Ember Live Example](https://vault-storybook.vercel.app/?path=/story/addon-centered--button)
-- [Storybook Addons](https://github.com/storybooks/storybook/tree/master/addons/)
-- [Storybook Docs](https://storybook.js.org/docs/basics/introduction/)
 - [Browserstack Automate](https://automate.browserstack.com/)

ui/jsconfig.json

@@ -5,9 +5,7 @@
  },
  "exclude": [
  "node_modules",
- ".storybook",
  ".yarn",
- "public",
- "storybook-static"
+ "public"
  ]
 }

ui/lib/core/addon/components/search-select.js

@@ -127,12 +127,6 @@ export default Component.extend({
  this.set('shouldUseFallback', true);
  return;
  }
- //special case for storybook
- if (this.staticOptions) {
- let options = this.staticOptions;
- this.formatOptions(options);
- return;
- }
  throw err;
  }
  }