FAQ

Frequently Asked Questions

We will fill this up as we go, bare with us :)

If you have any questions that aren't covered yet, feel free to write us to support@bojagi.io.

Can I use Bojagi with my existing Storybook stories?

Yes.

Bojagi stories work the same way storybooks stories work. In most cases Bojagi understands this file out of the box. Using some Storybook plugins might break them for us in some cases, please contact us in that case.

NOTE: if you have a path other than ./src/**/*.stories.js configured in your storybook/main.js you might need to adjust the storyPath value in the Bojagi configs in order for bojagi to find them.

My story crashes when using the react router Link component

React router Link needs to be inside a router. We recommend using a global decorator and MemoryRouter to wrap all your stories.

// .bojagi/decorator.js
import React from 'react';
import { MemoryRouter } from 'react-router';

const withDecorator = story => <MemoryRouter>{story()}</MemoryRouter>;

export default withDecorator;

My components are missing styling

The reason for this might be that you need to import your CSS globally and not do it per component. If you are doing this in your app, you can use a global decorator:

// .bojagi/decorator.js
import React from 'react';
// Import your CSS here
import '../static/main.css';

const withDecorator = story => <>{story()}</>;

export default withDecorator;

Make sure you have a css and style loader in your webpack config. If you don't want to add it you can create a specific webpack config for Bojagi and reference it in the Bojagi configs.

Bojagi components are not visible after upload via Github actions

This is a common error that can happen when you use the pull_request trigger. As this event is triggered on the merge commit between the base and the head of the PR it checks out this new commit. Because in the GitHub API this commit has no relation to the Pull Request we can't resolve it correctly. To make it work via the pull_request trigger you need to adjust the checkout action:

- uses: actions/checkout@v2
  with:
    ref: ${{github.event.pull_request.head.ref}}
    repository: ${{github.event.pull_request.head.repo.full_name}}

This checks out the head commit of the PR rather than the commit that merges it with the base

Find a working example here: https://github.com/Bojagi/bojagi-example-gh-actions

Pull Requests from forks don't work on my CI

Many CIs don't run jobs on Pull Requests from forks or run in a safe mode where secrets are not passed. The Bojagi CLI needs this secret though to upload the components properly.

Some CI providers have solutions for this. Please search their documentation for more information.

For GitHub Actions you can use a separate workflow for uploading. You can find the example here: https://github.com/Bojagi/bojagi-example-gh-actions