The frontend React App for Comfy Registry.

Registry React Frontend Github

Registry CLI Github

Install Prettier + Eslint extensions.

.vscode/settings.json is set up in the workspace to lint + format code on save.

Run the development server

git checkout dev
curl -fsSL https://bun.sh/install | bash
bun install
bun dev

Open http://localhost:3000 with your browser to see the result.

For features that require GitHub authentication (like node claiming), you'll need to set up a GitHub OAuth App. See docs/github-app.md for detailed setup instructions.

We use Storybook for component development and documentation. To run Storybook:

pnpm run storybook

Open http://localhost:6006 to view the component library. Storybook allows you to:

• View and interact with components in isolation
• Test different component states and variations
• See documentation for components
• Develop UI components in isolation without running the full app

We use Chromatic for visual testing and UI reviews:

# Make sure to set your project token
export CHROMATIC_PROJECT_TOKEN=your_token
pnpm run chromatic

See docs/chromatic-setup.md for more details on our Chromatic CI/CD integration.

We provide a GitHub Actions workflow to automatically update open PR branches with the latest changes from main. This is useful for:

• Keeping long-running PRs up-to-date
• Reducing merge conflicts
• Repository maintenance

See docs/update-pr-branches.md for detailed usage instructions.

Start the dev server.

Currently, the Orval spec is in orval.config.js. It points to the OpenAPI spec in your localhost server. This can be changed to staging or prod.

npx orval

This generates react queries that you can use in your Components.

Make a PR to the main branch. Once merged, Vercel will deploy to https://comfyregistry.org

To enable CORS on the google cloud storage bucket, reference the cors.json file. More info here.

gcloud storage buckets update gs://comfy-registry --cors-file=cors.json