Before performing any complex frontend task, Kombai always generates an editable plan for you to approve or update. This ensures that the task and generated code is always in your control. Complexity of a task is determined by the number of sections, images, icons, global store entities, queries, etc. required in the code.

​
How to turn on plan for complex tasks

  1. Click icon in Kombai’s input box.
  2. Switch the Plan before complex tasks setting on.

​
Plan files structure

  1. Sections: List of all the sections present in the design or input instructions.
  2. Features: List of all the features that will be generated based on your input.
  3. Editable plan files: Kombai provides the following editable files with each plan:
  • schema.ts
  • endpoints.ts
  • rootProps.ts
  • theme.ts
  • enums.ts
  1. Style Guide: It lets you define the colors, appearance, typography, and animation for the code. Style guide is currently generated only for landing pages.

​
How to approve the plan

Once the plan is generated, click the Approve Plan & Start Coding button to accept the plan and start the code generation process.

​
How to update the plan

Once the plan is generated, you can edit the generated plan files as ask Kombai to make changes to the plan.

​
Through Files Edit

  1. Click the icon at the top right corner of a plan section. This will open the section in a new tab.
  2. Modify the plan and save the file. You will now see the modified tag on that plan section.
  3. Click the Update Plan button at the bottom of the plan to start the code generation process.

​
Through Follow Up

Instead of editing the plan files, you can also ask Kombai to make changes to the plan through a follow-up:
  1. Type the changes you want to make to the plan, (e.g., “Implement dark mode on click of toggle”).
  2. Kombai will now regenerate the plan with the changes you requested.
  3. Click the Approve Plan & Start Coding button to accept the plan and start the code generation process.