diff --git a/.claude/hooks/post-edit.sh b/.claude/hooks/post-edit.sh new file mode 100755 index 0000000000..1e106043b5 --- /dev/null +++ b/.claude/hooks/post-edit.sh @@ -0,0 +1,56 @@ +#!/bin/bash +# Auto-format and lint after file edits. +# Works with both Claude Code (PostToolUse) and GitHub Copilot (postToolUse) hooks. +# +# Input formats: +# Claude Code: {"tool_input": {"file_path": "/path/to/file"}} +# Copilot: {"toolName": "edit", "toolArgs": "{\"path\": \"/path/to/file\"}"} +# +# Exit codes: +# 0 = success (formatting applied silently) +# 2 = lint errors found (fed back to Claude as feedback; ignored by Copilot) + +# Parse file path - handles both Claude Code and Copilot input formats +FILE_PATH=$(cat | node -e " + let d=''; + process.stdin.on('data',c=>d+=c); + process.stdin.on('end',()=>{ + try { + const j=JSON.parse(d); + if (j.tool_input?.file_path) { console.log(j.tool_input.file_path); return; } + if (j.toolArgs) { const a=JSON.parse(j.toolArgs); if (a.path) console.log(a.path); } + } catch {} + }) +") + +# Skip if no file path or file doesn't exist +[[ -z "$FILE_PATH" || ! -f "$FILE_PATH" ]] && exit 0 + +# Find the nearest package directory with eslint config +SEARCH_DIR=$(dirname "$FILE_PATH") +PACKAGE_DIR="" +while [[ "$SEARCH_DIR" != "/" ]]; do + if [[ -f "$SEARCH_DIR/eslint.config.mjs" ]]; then + PACKAGE_DIR="$SEARCH_DIR" + break + fi + SEARCH_DIR=$(dirname "$SEARCH_DIR") +done + +# Auto-format with prettier from the package directory +if [[ -n "$PACKAGE_DIR" ]]; then + (cd "$PACKAGE_DIR" && pnpm exec prettier --write "$FILE_PATH" 2>/dev/null) +else + pnpm exec prettier --write "$FILE_PATH" 2>/dev/null +fi + +# Run lint from the package directory using the project's lint setup +if [[ -n "$PACKAGE_DIR" ]]; then + LINT_OUTPUT=$(cd "$PACKAGE_DIR" && pnpm run lint 2>&1) + if [[ $? -ne 0 ]]; then + echo "$LINT_OUTPUT" >&2 + exit 2 + fi +fi + +exit 0 diff --git a/.claude/settings.json b/.claude/settings.json new file mode 100644 index 0000000000..645c92480f --- /dev/null +++ b/.claude/settings.json @@ -0,0 +1,15 @@ +{ + "hooks": { + "PostToolUse": [ + { + "matcher": "Edit|Write|MultiEdit", + "hooks": [ + { + "type": "command", + "command": ".claude/hooks/post-edit.sh" + } + ] + } + ] + } +} diff --git a/.github/hooks/hooks.json b/.github/hooks/hooks.json new file mode 100644 index 0000000000..d8c4374f37 --- /dev/null +++ b/.github/hooks/hooks.json @@ -0,0 +1,11 @@ +{ + "version": 1, + "hooks": { + "postToolUse": [ + { + "type": "command", + "bash": "bash .claude/hooks/post-edit.sh" + } + ] + } +} diff --git a/.gitignore b/.gitignore index 70104cb4d9..05f92d3d0b 100644 --- a/.gitignore +++ b/.gitignore @@ -28,3 +28,4 @@ tests automation/run-e2e/ctrf/*.json .cursor .windsurf +.claude/settings.local.json diff --git a/AGENTS.md b/AGENTS.md index 2b77c77fc7..53fb367c83 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -1,94 +1,35 @@ -# Mendix Web Widgets Repository - AI Agent Overview +# Mendix Web Widgets Repository -This document provides a comprehensive overview of the Mendix Web Widgets repository structure and conventions for AI development assistants. This repository contains the official collection of pluggable web widgets for the Mendix low-code platform. +Monorepo of official Mendix pluggable web widgets. pnpm workspaces + Turbo. -## Repository Overview +## Structure -The **Mendix Web Widgets** repository is the official home of all Mendix platform-supported pluggable web widgets and related modules. These are reusable UI components built with modern web technologies (React, TypeScript, SCSS) that integrate seamlessly into Mendix Studio Pro applications. +- `packages/pluggableWidgets/*-web` — Widget packages (React, TypeScript, SCSS) +- `packages/modules/*` — Mendix module packages +- `packages/shared/*` — Shared configs and utilities +- `automation/` — Build and release automation +- `docs/requirements/` — Detailed technical requirements -### Key Characteristics -- **Monorepo structure** using pnpm workspaces and Turbo for build orchestration -- **Modern web stack**: TypeScript, React, SCSS, Jest, ESLint, Prettier -- **Mendix integration**: Built using Mendix Pluggable Widgets API -- **Atlas UI alignment**: Consistent with Mendix's design system -- **Comprehensive testing**: Unit tests (Jest/RTL), E2E tests (Playwright) +## Commands -## Repository Structure +| Command | Description | +|---------|-------------| +| `pnpm install` | Install dependencies | +| `pnpm build` | Build all packages | +| `pnpm lint` | Lint all packages | +| `pnpm test` | Test all packages | +| `pnpm --filter @mendix/ run