updated the menu

utkarshx · utkarshx · commit 3ab152fcccf1 · 2025-06-02T16:39:14.000+05:30
diff --git a/docs/api/apiaccess/index.md b/docs/api/apiaccess/index.md
@@ -78,6 +78,10 @@ cbapicategory:
 ---
 # Direct API Access
 
+## Overview
+
+Codebolt provides a set of APIs that can be used by agents to interact with the Codebolt application. This allows to build agents that can interact with the Codebolt application. To start using the APIs from an agent, please refer to the Codebolt Agent documentation in the Developer Guide.
+
 ## API List
 
 <CBAPICategory />
diff --git a/docs/api/overview.md b/docs/api/overview.md
@@ -1,5 +1,5 @@
 ---
-sidebar_label: API Overview
+sidebar_label: System Interfaces
 sidebar_position: 1
 ---
 # CodeboltAI System Interfaces
diff --git a/docs/developer/agents/1_agentIntroduction.md b/docs/developer/agents/1_agentIntroduction.md
diff --git a/docs/developer/agents/1_agentarchitecture/1_architecture.md b/docs/developer/agents/1_agentarchitecture/1_architecture.md
diff --git a/docs/developer/agents/1_agentarchitecture/_category_.json b/docs/developer/agents/1_agentarchitecture/_category_.json
diff --git a/docs/developer/agents/2_usingagents/2_quickstart.md b/docs/developer/agents/2_usingagents/2_quickstart.md
diff --git a/docs/developer/agents/2_usingagents/5_runAgent.md b/docs/developer/agents/2_usingagents/5_runAgent.md
@@ -11,7 +11,7 @@ To use or run an agent, you’ll need to follow these steps:
 
 * **Switch Agents as Needed**: If you need a different set of functions, return to your agent list to deactivate the current agent and select another. For instance, if you’re done with development and need to deploy, switch from CodeBolt Dev to CodeBolt Web Deployment for automated deployment support.
 
-![selectAgent](../../../static/img/browseAgent.png)
+![selectAgent](/img/browseAgent.png)
 
 **To use agent in chat, you can follow these steps:**
 
@@ -23,6 +23,6 @@ In the chat interface, click on the `# symbol`. This will open list of all avail
 
 * **Switch Agents if Needed**: If you need help with a different type of task, click # again to open the agent list, select another agent, and start your next interaction.
 
-![runAgent2](../../../static/img/selectMarketplaceAgent.png)
+![runAgent2](/img/selectMarketplaceAgent.png)
 
-![runAgent2](../../../static/img/SelectFormAgent.png)
+![runAgent2](/img/SelectFormAgent.png)
diff --git a/docs/developer/agents/2_usingagents/_category_.json b/docs/developer/agents/2_usingagents/_category_.json
diff --git a/docs/developer/agents/3_customagents/3_firstExtension.md b/docs/developer/agents/3_customagents/3_firstExtension.md
@@ -22,15 +22,15 @@ To begin creating a new agent:
 1. **Open Codebolt** and navigate to the chat interface.
 2. **Click on the "Create Agent" button** in the chat window. This option is typically found in the sidebar or main interface.
 
-![In chat window click on create agent](../../../static/img/create-agent.png)
+![In chat window click on create agent](/img/create-agent.png)
 
 ### 2. Select Agent Type
 
 Next, you'll need to choose the type of agent you want to create:
 
 1. **Select "Custom Agent"** from the available options. This allows you to create an agent with your own defined functionality.
 
-![Select custom agent](../../../static/img/custom-agent.png)
+![Select custom agent](/img/custom-agent.png)
 
 ### 3. Configure Your Agent
 
@@ -39,15 +39,15 @@ Now it's time to set up the basic details for your agent:
 1. **Name Your Agent**: Enter a descriptive name that indicates the agent's purpose.
 2. **Add a Description**: Provide a brief description explaining what your agent does.
 
-![Name and description for agent](../../../static/img/agent-name.png)
+![Name and description for agent](/img/agent-name.png)
 
 ### 4. Creation Confirmation
 
 After configuring your agent, the system will create the necessary files and structure:
 
 1. **Success Message**: You'll see a confirmation screen indicating that your agent has been successfully created.
 
-![Success confirmation screen](../../../static/img/success.png)
+![Success confirmation screen](/img/success.png)
 
 ### 5. Explore Generated Code
 
@@ -58,7 +58,7 @@ Codebolt will generate a starter code structure for your agent:
    - Configuration files
    - Dependencies and setup scripts
 
-![Generated code structure](../../../static/img/code.png)
+![Generated code structure](/img/code.png)
 
 ### 6. Understanding the Agent Structure
 
diff --git a/docs/developer/agents/3_customagents/4_runExtension.md b/docs/developer/agents/3_customagents/4_runExtension.md
@@ -8,28 +8,28 @@ This guide will walk you through the process of running a local agent in Codebol
 - Open Codebolt and locate the "Agent" section in the chat window
 - Click on the "Agent" dropdown menu in the top bar
 
-![Access Agent Menu](../../../static/img/browseAgent.png)
+![Access Agent Menu](/img/browseAgent.png)
 
 ### 2. Navigate to Local Agents
 - Click on "Browse agents" in the dropdown menu
 - Select "Local agent" from the available options
 
-![Select Local Agent](../../../static/img/selectLocalAgent.png)
+![Select Local Agent](/img/selectLocalAgent.png)
 
 ### 3. Select Your Agent
 - Browse through the list of available local agents
 - Each agent will display its name and basic information
 - Click on the agent you want to activate
 - The selected agent will become your active assistant
 
-![Select From Local Agents](../../../static/img/selectFormAllLocalAgent.png)
+![Select From Local Agents](/img/selectFormAllLocalAgent.png)
 
 ### 4. Debug Your Agent
 - All debug logs will be displayed in the debug window
 - Use these logs to troubleshoot any issues with your agent's performance
 - Monitor the execution of your agent's actions in real-time
 
-![Debug Agent](../../../static/img/DebugAgent.png)
+![Debug Agent](/img/DebugAgent.png)
 
 ### 5. Interact with Your Agent
 - Once activated, you can communicate with your local agent directly in the chat window
diff --git a/docs/developer/agents/3_customagents/6_publishExtension.md b/docs/developer/agents/3_customagents/6_publishExtension.md
@@ -21,4 +21,4 @@ Once you're in the correct directory and logged in, publish the agent using the
 npx codebolt-cli publish
 ```
 
-![publish agent](../../../static/img/publish_agent.png)
+![publish agent](/img/publish_agent.png)
diff --git a/docs/developer/agents/3_customagents/_category_.json b/docs/developer/agents/3_customagents/_category_.json
diff --git a/docs/developer/agents/4_remixagents/1_aboutremixagents.md b/docs/developer/agents/4_remixagents/1_aboutremixagents.md
@@ -19,13 +19,13 @@ The Remix Agent is suitable for environments where there is a need for real-time
 
 
 1. Navigate to the chat window and click on the "Create Agent" option.
-   ![How to create remix agent](../../../static/img/howtocreateremix.png)
+   ![How to create remix agent](/img/howtocreateremix.png)
 
 2. Select the "Remix Agent" from the options available.
-   ![Click on Remix Agent](../../../static/img/selectremix.png)
+   ![Click on Remix Agent](/img/selectremix.png)
 
 3. Modify the settings of the agent you wish to remix according to your requirements.
-   ![Modify settings](../../../static/img/modifymodelormcps.png)
+   ![Modify settings](/img/modifymodelormcps.png)
 
 ## Using Local MCPs
 
diff --git a/docs/developer/agents/4_remixagents/_category_.json b/docs/developer/agents/4_remixagents/_category_.json
diff --git a/docs/developer/tools/1_tools.md b/docs/developer/tools/1_tools.md
diff --git a/docs/developer/tools/2_create_tool.md b/docs/developer/tools/2_create_tool.md
@@ -10,11 +10,11 @@ You can create a new tool using either the Codebolt UI or the CLI:
 
 Navigate to the Codebolt dashboard and use the tool creation interface:
 
-![Codebolt tool creation interface](../../static/img/mcpcreate.png)
+![Codebolt tool creation interface](/img/mcpcreate.png)
 
 Enter a descriptive name for your tool:
 
-![Naming your Codebolt tool](../../static/img/nameyourmcp.png)
+![Naming your Codebolt tool](/img/nameyourmcp.png)
 
 ### Option 2: Using the CLI
 
@@ -26,13 +26,13 @@ npx codebolt-cli createtool <toolName>
 
 Replace `<toolName>` with a descriptive name for your tool.
 
-![CLI tool creation example](../../static/img/createTool.png)
+![CLI tool creation example](/img/createTool.png)
 
 ## Tool Configuration
 
 After creation, your tool will be available in the `.codeboltAgent/tool` directory within your project structure. This directory contains all configuration and implementation files needed for your tool.
 
-![Tool directory structure](../../static/img/modifyyourtool.png)
+![Tool directory structure](/img/modifyyourtool.png)
 
 ## Customization Options
 
@@ -43,7 +43,7 @@ You can customize various aspects of your tool:
 - Output formatting and response handling
 - Integration with external services
 
-For detailed information on available configuration options, refer to the [Tool Configuration Reference](../api/apiaccess/tool/index.md).
+For detailed information on available configuration options, refer to the [Tool Configuration Reference](../../api/apiaccess/tool/index.md).
 
 ## Testing and Deployment
 
diff --git a/docs/developer/tools/3_testlocalmcp.md b/docs/developer/tools/3_testlocalmcp.md
@@ -14,13 +14,13 @@ You can test your local MCP using either the graphical interface or the command-
 
 Access the MCP panel by clicking the MCP icon in the Codebolt interface.
 
-![Open MCP Panel](../../static/img/openMcp.png)
+![Open MCP Panel](/img/openMcp.png)
 
 #### 2. Select Local MCP
 
 From the dropdown menu, select "Local MCP" to connect to your locally running instance.
 
-![Select Local MCP](../../static/img/SelectMcp.png)
+![Select Local MCP](/img/SelectMcp.png)
 
 ### Option 2: Using the CLI
 
diff --git a/docs/developer/tools/4_publish_tool.md b/docs/developer/tools/4_publish_tool.md
diff --git a/docs/user/4_Templates/myTemplates.md b/docs/user/4_Templates/myTemplates.md
@@ -4,7 +4,7 @@ Streamline Your Workflow with Custom Templates: Codebolt enables users to upload
 
 Seamless Integration with Codebolt: Once uploaded, your custom templates are seamlessly integrated into the Codebolt app, empowering you to kickstart new projects efficiently while leveraging your personalized settings and configurations.
 
-![myTemplate](../../../static/img/mytemplates.png)
+![myTemplate](/img/mytemplates.png)
 
 
 ## Video Guide
diff --git a/docs/user/4_Templates/template.md b/docs/user/4_Templates/template.md
@@ -19,5 +19,5 @@ To create a new project using a template in Codebolt, follow these steps:
 
 Codebolt will then set up your project with the necessary files and configurations, and you'll be ready to start coding!
 
-![Template](../../../static/img/template.png)
+![Template](/img/template.png)
 
diff --git a/docs/user/5_Apps/publish.md b/docs/user/5_Apps/publish.md
@@ -7,52 +7,52 @@ This guide walks you through the process of publishing your application using Co
 2. Configure your application's basic settings
 3. Confirm the creation process
 
-![create agent](../../../static/img/create-ui-app.png)
+![create agent](/img/create-ui-app.png)
 
 ## Step 2: Configure Application Settings
 1. Set up all application-related configurations
 2. Define the required parameters for your application
 
-![after success](../../../static/img/app-use-setting.png)
+![after success](/img/app-use-setting.png)
 
 ## Step 3: Provide Technical Information
 1. Fill in all technical details about your application
 2. Include system requirements and compatibility information
 
-![technical](../../../static/img/tech-info.png)
+![technical](/img/tech-info.png)
 
 ## Step 4: Configure Development Settings
 1. Set up your development environment parameters
 2. Define build and deployment configurations
 
-![development setting](../../../static/img/develop-setting.png)
+![development setting](/img/develop-setting.png)
 
 ## Step 5: Configure Installation Settings
 1. Specify installation requirements and procedures
 2. Define any pre-installation or post-installation steps
 
-![installation setting](../../../static/img/installation-setting.png)
+![installation setting](/img/installation-setting.png)
 
 ## Step 6: Configure Application Usage Settings
 1. Define how users will interact with your application
 2. Set up any required user permissions or access controls
 
-![app using setting](../../../static/img/app-use-setting.png)
+![app using setting](/img/app-use-setting.png)
 
 ## Step 7: Publish Your Application
 1. Review all settings and configurations
 2. Click the "Publish" button to make your application live
 
-![publish app](../../../static/img/publish-app.png)
+![publish app](/img/publish-app.png)
 
 ## Step 8: Verify Your Application Structure
 1. Review the final application structure
 2. Confirm all components are properly configured
 
-![confirm](../../../static/img/confirm.png)
+![confirm](/img/confirm.png)
 
 
 ## Step 9: Find Your Application
 1. Locate your newly created application
 
-![find app](../../../static/img/after-install.png)
+![find app](/img/after-install.png)
diff --git a/docs/user/features/controlK.md b/docs/user/features/controlK.md
@@ -1,7 +1,7 @@
 # Ctrl K
 
 
-![LLMs Settings](../../../static/img/llm-setting.png)
+![LLMs Settings](/img/llm-setting.png)
 
 Ctrl K lets you edit and write code with the codebolt AI:
 
diff --git a/docs/user/features/llms.md b/docs/user/features/llms.md
@@ -6,4 +6,4 @@
   - **LM Studio**
 - Additionally, you can explore and choose from the **Available Models** within each provider.
 
-![LLMs Settings](../../../static/img/llm-setting.png)
+![LLMs Settings](/img/llm-setting.png)
diff --git a/docs/user/module/browser.md b/docs/user/module/browser.md
@@ -2,7 +2,7 @@
 
 Access a built-in web browser to view and interact with web content directly from the chat interface.
 
-![Browser](../../../static/img/browser.png)
+![Browser](/img/browser.png)
 
 - Reference Video
 
diff --git a/docs/user/module/codeeditor/index.md b/docs/user/module/codeeditor/index.md
@@ -1,7 +1,7 @@
 # Code Editor 
 
 
-![codeview](../../../../static/img/codeview.png)
+![codeview](/img/codeview.png)
 
 **Referance Video**
 
diff --git a/docs/user/module/console.md b/docs/user/module/console.md
@@ -3,7 +3,7 @@
  - View console output.
  - Monitor and debug application processes and operations within the chat.
 
- ![Console](../../../static/img/console.png)
+ ![Console](/img/console.png)
 
  **Video Guide**
 
diff --git a/docs/user/module/git.md b/docs/user/module/git.md
@@ -6,7 +6,7 @@
  - Manage version control through the chat interface.
 
 
-![git](../../../static/img/git.png)
+![git](/img/git.png)
 
 **Video Guide**
 
diff --git a/docs/user/module/index.md b/docs/user/module/index.md
@@ -3,7 +3,7 @@
 Use CodeBolt's built-in chat to get help from Agent AI. Start a new conversation to ask questions, solve problems, and get coding advice instantly. Agent AI assists with coding issues and project guidance, making troubleshooting faster and easier.
 
 
-![Chat](../../../static/img/chat_view.png)
+![Chat](/img/chat_view.png)
 
 <!-- ### Chat Features -->
 
diff --git a/docs/user/module/marketplace.md b/docs/user/module/marketplace.md
@@ -4,6 +4,6 @@
  - Install new agents.
  - View and manage installed agents.
 
- ![Marketplace](../../../static/img/market_place.png)
+ ![Marketplace](/img/market_place.png)
 
  <iframe width="100%" height="500" src="https://www.youtube.com/embed/5B7EKgU4u_Q?si=_CSlSihwK47cLQkg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
diff --git a/docusaurus.config.ts b/docusaurus.config.ts
@@ -66,22 +66,22 @@ const config: Config = {
           type: 'docSidebar',
           sidebarId: 'userSidebar',
           position: 'left',
-          label: 'Docs',
+          label: 'User Guide',
         },
         {
           type: 'docSidebar',
           sidebarId: 'devSidebar',
           position: 'left',
-          label: 'Agents',
-        },
-        {
-          type: 'docSidebar',
-          sidebarId: 'toolSidebar',
-          position: 'left',
-          label: 'Tools',
+          label: 'Developer Guide',
         },
         // {
         //   type: 'docSidebar',
+        //   sidebarId: 'toolSidebar',
+        //   position: 'left',
+        //   label: 'Tools',
+        // },
+        // {
+        //   type: 'docSidebar',
         //   sidebarId: 'appSidebar',
         //   position: 'left',
         //   label: 'Apps',
diff --git a/sidebars.ts b/sidebars.ts
@@ -14,9 +14,9 @@ const sidebars: SidebarsConfig = {
   // By default, Docusaurus generates a sidebar from the docs folder structure
   jsapiSidebar: [{type: 'autogenerated', dirName: 'api'}],
   userSidebar: [{type: 'autogenerated', dirName: 'user'}],
-  devSidebar: [{type: 'autogenerated', dirName: 'agents'}],
+  devSidebar: [{type: 'autogenerated', dirName: 'developer'}],
   // appSidebar: [{type: 'autogenerated', dirName: 'apps'}],
-  toolSidebar: [{type: 'autogenerated', dirName: 'tools'}],
+  // toolSidebar: [{type: 'autogenerated', dirName: 'tools'}],
 
   // But you can create a sidebar manually
   
diff --git a/src/css/custom.css b/src/css/custom.css
