console

The console of 🔮 Instill Core

The console, developed using Nextjs, Typescript, and TailwindCSS, operates in a docker container alongside other 🔮 Instill Core components. Want to give it a try? Visit the instill-core repository to run the suite on your local machine.

The primary objective of the console is to offer a unified, streamlined, and user-friendly interface for 🔮 Instill Core. It allows users to create, manage, and observe pipelines, models, and artifacts directly from their browser.

Folder structure

• apps: Store all the instill-ai apps
  • console: The Instill AI console APP
• packages: Store all the packages that will be used across instill-ai frontend projects
  • design-system: The base component of all the instill-ai frontend projects
  • design-token: The design-token that unify the style
  • toolkit: All the high level component of instill-ai frontend projects

Normally, we won't touch the components of design-system due to the casualty will be huge. Most of our development is centering around the toolkit. And the console only consume the components from toolkit without having its own components.

Code Style and Best practices

Please refer to the Instill AI Frontend Engineer Handbook

Contributing

Please refer to the Contributing Guidelines for more details.

How to contribute to the console's integration connection

We plan to support using our component through OAuth, so user don't need to manually input the token. Right now console already support Slack and Github integration connection. We will add more integration connection in the future.

If you want to add a new integration connection, you can refer to the Integration Connection document for more details.

Available scripts

Please refer to the Scripts document for more details.

How we set up the environment variables

Please refer to the Environment variables document for more details.

How to test the console

Please refer to the Integration test document for more details.

CI/CD

Please refer to the CI/CD document for more details.

How to add templates into instill-ai

Please refer to the Template document for more details.

License

See the LICENSE file for licensing information.

About the exported CSS variables

• --pipeline-builder-node-available-width: control the max width of the node
• --pipeline-builder-node-padding-x
• --pipeline-builder-node-padding-y