Contributing to Fuselage

Prev Next

This section describes how to set up the Fuselage repository locally and contribute changes. Fuselage is a monorepo containing multiple UI packages used across Rocket.Chat applications.

Setup

  1. Clone the repository:

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

  1. Inspect available packages. Packages are located under:

cd fuselage/packages/
ls

Each folder represents a separate Fuselage package.

  1. Install dependencies and build. From the repository root:

yarn && yarn build

This installs dependencies and builds all packages.

Running storybook

Some packages include Storybook for local component development.

To run Storybook for a specific package:

cd packages/fuselage   # or another package
yarn storybook

Storybook runs on port 6006.

If you create a new component, you must provide a Storybook story. Pull requests without stories will not be approved.

Snapshots

If you modify a component, you must update Jest snapshots before opening a pull request.

yarn jest --updateSnapshot

This generates or updates snapshot files named:

<ComponentName>.spec.tsx.snap

These files must be committed. If they are missing or outdated, CI will fail. For additional details, refer to Jest snapshot documentation.

After merge

Once a pull request is merged:

  • The changes become part of the Fuselage repository.

  • Updated Fuselage packages are published during the Rocket.Chat release cycle.

Testing changes in Rocket.Chat

If you need to test local Fuselage changes inside the Rocket.Chat repository, follow the instructions in the Fuselage components documentation.