An Electron-based desktop application for DevOps workflows, built with React and TypeScript using Electron Forge.

Features

• Menu Dashboard: A central hub for all DevOps tools using a clean Bootstrap-based UI.
• Unified Navigation: All tools feature a consistent, fixed, edge-to-edge header with a back button and page title for better usability on long forms.
• Test Case Writer:
  • Integration with Azure DevOps to fetch work item details (ID, Title, Description, Acceptance Criteria).
  • Ability to seamlessly write generated test cases back to Azure DevOps as Comments or new Child Tasks (created as linked 'Task' items with an AI disclaimer).
  • Integration with GitHub Copilot SDK to automatically generate comprehensive test cases based on ticket context, with the ability to select specific models (e.g., GPT-4o, Claude 3.5 Sonnet).
  • Markdown support with GFM (tables, lists, etc.) for rendered results.
• Story Writer:
  • Integration with Confluence REST API to read requirements directly from documentation pages.
  • Prompts GitHub Copilot SDK to generate structured JSON containing user stories with Titles, Descriptions, and Acceptance Criteria, using your chosen AI model.
  • Ability to selectively choose generated stories and write them back to Azure DevOps as new Product Backlog Items (PBIs) linked under a specific Feature.
• Persistent Settings: Securely store Azure DevOps credentials, Confluence tokens, and project configuration locally, select a default Copilot model, and actively check the status of local GitHub Copilot CLI authentication. The settings page features a fixed top panel for quick access to save and back actions.

Tech Stack

• Framework: Electron (via Electron Forge)
• Frontend: React + TypeScript
• Styling: Bootstrap 5 + FontAwesome 6
• Navigation: React Router Dom
• APIs & Integration:
  • azure-devops-node-api: For interacting with Azure DevOps REST APIs.
  • @github/copilot-sdk: For AI-powered generation via GitHub Copilot.
  • Confluence REST API: Utilizing internal fetches for reading Atlassian Cloud content via Basic Auth using API Tokens.
• Storage: electron-store for persistent configuration.
• Markdown: react-markdown + remark-gfm for rich text rendering.

Getting Started

Prerequisites

• Node.js (LTS recommended)
• GitHub Copilot CLI: You must be authenticated via the Copilot CLI on your machine (launch copilot, enter /login and follow the prompts).
  • Note for Windows Users: You must set the NODE_PATH (path to Node.js executable) and COPILOT_SCRIPT_PATH (path to the Copilot JS script) environment variables for the Copilot client to initialize correctly.
• Azure DevOps PAT: A Personal Access Token with "Work Items: Read & Write" permissions.
• Confluence API Token: An Atlassian API Token generated from your profile settings (to be paired with your login email) for basic authentication.

Installation

npm install

Note: Running npm install automatically configures Husky to set up a git pre-commit hook.

Running the Application (Development)

npm start

Development

Code Formatting

This project uses Prettier for consistent code style.

• Automatic: A pre-commit hook (via husky and lint-staged) automatically formats your staged files before each commit.
• Manual: You can format all supported files manually by running:

  npm run format

Linting

To check for code quality and style issues:

npm run lint

Packaging for Distribution

npm run package
# or
npm run make

Project Structure

.
├── assets/             # Static assets (logos, icons)
├── docs/               # Technical documentation
├── src/
│   ├── main/           # Main process logic (Node.js environment)
│   │   ├── index.ts    # Main process entry point & IPC Handlers
│   │   ├── preload.ts  # Preload script for IPC and secure bridge
│   │   └── services/   # Encapsulated backend API services (Azure, Copilot, Confluence)
│   └── renderer/       # Renderer process (React environment)
│       ├── components/ # Shared React components
│       ├── hooks/      # Custom React hooks (e.g., useCopilotModels)
│       ├── pages/      # Application views (Menu, Settings, TestCaseWriter, StoryWriter)
│       ├── App.tsx     # Main React component with Routing
│       ├── index.css   # Global styles & Markdown overrides
│       ├── index.html  # Main HTML template
│       └── renderer.tsx # Renderer entry point (React mount)
├── forge.config.ts     # Electron Forge configuration
├── tsconfig.json       # TypeScript configuration
├── webpack.main.config.ts     # Webpack config for main process
└── webpack.renderer.config.ts # Webpack config for renderer process

Architecture

For a detailed explanation of the process model, configuration management, and AI integration, see docs/ARCHITECTURE.md.

License

MIT