New
NextJS, SvelteKit, Remix and the future of StorybookAutomate with Chromatic
Star75,387
Back to integrations
Add your integration
Categories
  • ⭐️ Popular
  • 🧩 Essentials
  • 🛠 Code
  • ⚡️ Data & state
  • ✅ Test
  • 💅 Style
  • 🎨 Design
  • ⚙️ Appearance
  • 🗄 Organize
How to install addons Create an addon
Github Issues
Display related github issues for a component
npm install storybook-addon-github-issues
Last updated 9 months ago
6
Downloads per week
Readme View on GitHub

Github issues for Storybook

Track issues logged against specific components in your repository

Getting Started

yarn add -D storybook-addon-github-issues

Add the following into your .env file:

GITHUB_REPOSITORY=username/repo
GITHUB_TOKEN=your_auth_token

...where your_auth_token is a Github personal access token with at least the repo scope. This will be used to access Github's GraphQL API to retrieve matching stories.

Add storybook-addon-github-issues to the addons list in .storybook/main.js.

In your .storybook/preview.js:

addParameters({
  issues: {
    repository: process.env.GITHUB_REPO,
    token: process.env.GITHUB_TOKEN,
  },
});

Tagging stories

By default, issues must have labels matching the name of the story, in kebab case. For example, if your component story is Atoms/Button, then you should tag your issues with button.

Join the community
5,862 developers and counting
WhyWhy StorybookComponent-driven UI
Open source software
Storybook

Maintained by
Chromatic
Special thanks to Netlify and CircleCI