Contributing to Fuselage

Prev

At Rocket.Chat, we believe great software is built through collaboration and the collective efforts of a community. As such, we're thrilled to welcome you to the Rocket.Chat Fuselage repository, where we develop the UI component library that powers the user interfaces of Rocket.Chat applications.

Whether you're a seasoned developer or just starting your coding journey, your contributions play a crucial role in shaping the future of our open-source project.

Contribute

To contribute to the Fuselage Monorepo, follow these guidelines:

  1. Clone the GitHub repository with this command:

    git clone https://github.com/RocketChat/fuselage.git

  2. Navigate to the packages directory to see the several existing packages.

    cd fuselage/packages/
ls

  3. Run this command at the root directory to build your project:

    yarn && yarn build

  4. Running Storybook:

    Some packages have storybook integrated. To run it, navigate to the desired package folder (in this example packages/fuselage) and run this command:

    yarn storybook

    This will open up Storybook on port 6006.

If you are creating a new component, you should create a story for it. Without a story, your pull request will likely not be approved or even considered ready for review.

Snapshots

After editing components in the fuselage package, the snapshots must first be updated before opening a pull request. To do that, you must run:

yarn jest --updateSnapshot

This command will output files named “<ComponentName>.spec.tsx.snap.” These must be included in the pull requests, or the continuous integration pipeline will fail. You can find additional documentation about snapshots on Jest’s snapshot docs page.

Merged pull request

Congratulations on getting your pull request merged! At the end of the Rocket.Chat release cycle, a new production version of the fuselage packages will be released.

Linking fuselage packages in Rocket.Chat

Effective testing is crucial for ensuring the reliability, performance, and user experience of the Fuselage components. Check out the Fuselage components documentation for detailed instructions and techniques.

We appreciate your contributions to the fuselage package and encourage you to work on new features and bug fixes. Let's continue this journey of improvement together!