CalliopeAI Extensions Build System

CalliopeAI Extensions Build System

Calliope Integration: This component is integrated into the Calliope AI platform. Some features and configurations may differ from the upstream project.

This document describes the integration of CalliopeAI extensions into the WAIIDE WAIIDE build.

Overview

The WAIIDE build system now automatically includes:

  • CalliopeAI WAIIDE Agent - AI coding assistant extension
  • Pergamon Theme - CalliopeAI’s branded theme, set as the default

Changes Made

1. Built-in Extensions

Extensions are now included as built-in extensions in WAIIDE/product.json:

{
  "builtInExtensions": [
    {
      "name": "calliope-WAIIDE-agent",
      "version": "0.0.1",
      "path": "./calliope-WAIIDE-agent"
    },
    {
      "name": "theme-pergamon",
      "version": "1.0.0",
      "path": "../calliope-theme"
    }
  ]
}

2. Default Theme

The default theme has been changed to Pergamon Blue in WAIIDE/src/vs/workbench/services/themes/common/workbenchThemeService.ts:

export enum ThemeSettingDefaults {
  COLOR_THEME_DARK = 'Pergamon Blue',
  COLOR_THEME_LIGHT = 'Pergamon Blue',
  // ... other themes
}

3. Build System

A new build script scripts/build-calliope-extensions.sh automatically:

  • Builds the CalliopeAI WAIIDE Agent extension
  • Copies both extensions to the WAIIDE extensions directory
  • Cleans up development dependencies to reduce image size

Usage

Building Extensions

# Build extensions only
./build.sh build-extensions

# Build full Docker image (includes extensions)
./build.sh build

Directory Structure

calliope-WAIIDE/
├── WAIIDE/                    # WAIIDE source (submodule)
│   ├── extensions/
│   │   ├── calliope-WAIIDE-agent/  # Copied from calliope-WAIIDE-agent/
│   │   └── theme-pergamon/         # Copied from calliope-theme/
│   └── product.json           # Modified to include built-in extensions
├── calliope-WAIIDE-agent/     # CalliopeAI Agent source (submodule)
├── calliope-theme/            # Theme source
├── scripts/
│   └── build-calliope-extensions.sh  # Extension build script
└── build.sh                   # Main build script (updated)

Requirements

  1. CalliopeAI Agent Extension is included as a git submodule at calliope-WAIIDE-agent/
  2. CalliopeAI Theme is located at calliope-theme/
  3. Both extensions must have valid package.json files
  4. The agent extension must support npm run build:production

Features

Non-Removable Extensions

Extensions are built into the WAIIDE binary and cannot be disabled or removed by users.

Default Theme

Pergamon Blue is automatically set as the default theme for both light and dark modes.

Automatic Build

Extensions are automatically built and included when running ./build.sh build.

Development

Testing Extensions

# Build extensions
./build.sh build-extensions

# Build and run container
./build.sh build
./build.sh up

# Access WAIIDE at http://localhost:8090

Modifying Extensions

  1. Make changes to the source extensions
  2. Run ./build.sh build-extensions to rebuild
  3. Rebuild the Docker image with ./build.sh build

Troubleshooting

Extension Build Fails

  • Ensure the calliope-WAIIDE-agent submodule is initialized: git submodule update --init
  • Check that calliope-WAIIDE-agent/package.json exists
  • Verify that npm install and npm run build:production work in the agent directory
  • Ensure Node.js and npm are installed

Theme Not Loading

  • Ensure calliope-theme/package.json has correct theme definition
  • Check that themes/pergamon-blue.json exists
  • Verify the theme name matches exactly: “Pergamon Blue”

Extensions Not Available

  • Check that WAIIDE/extensions/calliope-WAIIDE-agent/ exists after build
  • Verify WAIIDE/extensions/theme-pergamon/ exists after build
  • Ensure WAIIDE/product.json has been modified correctly

CI/CD Environment Setup

For continuous integration environments, ensure submodules are properly initialized:

# In your CI pipeline
git submodule update --init --recursive

# Build the image
./build.sh build

GitHub Actions Configuration

The CI workflows have been updated to automatically handle submodules:

- name: Checkout WAIIDE
  uses: actions/checkout@v4
  with:
    submodules: 'recursive'
    token: ${{ secrets.GITHUB_TOKEN }}

Build Process

The build script automatically:

  1. Checks for and initializes submodules if needed
  2. Installs main extension dependencies
  3. Installs webview (coder-gui) dependencies separately
  4. Builds both webpack (extension) and vite (webview) components
  5. Copies extensions to WAIIDE and cleans up dev dependencies

This resolves the previous Vite.js import errors by ensuring all subdirectory dependencies are properly installed.

Files Modified

  • WAIIDE/product.json - Added built-in extensions
  • WAIIDE/src/vs/workbench/services/themes/common/workbenchThemeService.ts - Changed default theme
  • build.sh - Added extension build step and submodule initialization
  • scripts/build-calliope-extensions.sh - Extension build script (updated for submodule path)
  • .gitmodules - Added calliope-WAIIDE-agent as submodule