Last month, Anders showed you how you could import a machine from GitHub by changing the GitHub URL in the browser’s address bar. We’ve added more to our GitHub integration. Our Pro users can now import all the machines from a repository into a Stately Studio project with the Import from GitHub button.

If you’ve been working with state machines in XState or using the XState VS Code extension to visualize your machines, this is a great way to import all the machines in your repo quickly. Once you’ve imported your machines into the Stately Studio, you can visualize and improve them in our Editor and easily share your machines with your team.

How to import all the machines from a GitHub repository

1. Navigate to My Projects from the sidebar or the Stately menu.
2. Use Import from GitHub to open the Import repo from GitHub modal.
3. The GitHub integration will fetch all available repositories (public and private).
4. Choose the repository from which you wish to import machines.
5. The Studio will import your machines into a new private project using the same name as your repository and open your project in the Editor.

Importing a machine with Import from GitHub or importing a machine with a GitHub URL will prompt you to Allow integration to give our GitHub integration access to your GitHub repositories. You will only be prompted if you have not yet given the GitHub integration access on your current device.

Currently, the Import from GitHub feature imports all machines from the default branch in your GitHub repository. If you want to import machines from a different branch or a pull request, we recommend importing each machine from a GitHub URL.

Try our Pro plan to import from GitHub

Import from GitHub is one of the Pro features of the Stately Studio. We offer a 7-day free trial on the Stately Studio Pro account so you can explore how our Pro features work for you and your team today!