chore: update .NET and npm packages to latest versions - #4
Open
AlahmadiQ8 wants to merge 23 commits into
Open
Conversation
- Updated .NET packages: - Azure.Identity 1.17.0 → 1.17.1 - Microsoft.Identity.Web 4.0.1 → 4.1.1 - Microsoft.Extensions.Http.Resilience 9.10.0 → 10.0.0 - Microsoft.Extensions.ServiceDiscovery 9.5.2 → 10.0.0 - OpenTelemetry packages 1.13.x → 1.14.0 - Updated npm packages: - React 19.1.1 → 19.2.1 - @azure/msal-browser 4.26.0 → 4.27.0 - @azure/msal-react 3.0.21 → 3.0.23 - @FluentUI packages to latest versions - Vite 7.2.0 → 7.2.6 - TypeScript ESLint 8.46.3 → 8.48.1 - Fixed 2 npm security vulnerabilities (js-yaml, mdast-util-to-hast) - All packages now up to date with 0 known vulnerabilities
Implement citation/annotation support for AI agent responses and improve cross-platform compatibility for macOS/Linux users. ## Features ### Annotations Support (Fixes #13) - Add AnnotationInfo model and StreamChunk for SSE responses - Emit 'annotations' SSE events during response streaming - Process SDK annotations (URI citations, file citations, file paths) - Display citations as numbered badges with icons (Azure AI Foundry style) - Show tooltips with citation quotes on hover - Deduplicate annotations by label/URL/startIndex ## Bug Fixes ### Docker Build Improvements - Add --platform linux/amd64 for ARM Mac compatibility (Fixes #9) - Use forward slashes in ACR build paths (Fixes #7, #10) ### Cross-Platform Support (Fixes #5) - Add macOS/Linux support in start-local-dev.ps1 (lsof for port detection) - Platform-aware process spawning (jobs on macOS, windows on Windows) - Improved prerequisite checks with macOS-specific install instructions ### Dependencies (Fixes #8) - Sync package-lock.json with package.json - Update Fluent UI Copilot to 0.30.3/0.13.2 - Update React to 19.2.3 ### Documentation (Fixes #2) - Update README with azd init -t template command - Add macOS/Linux installation instructions ## Infrastructure - Add azd-env-name tag to all resources for tracking
## Summary Restructure AI assistant documentation from distributed AGENTS.md files to centralized Skills system for on-demand context loading, reducing token consumption and improving guidance quality. ## Architecture Changes ### Removed Files (AGENTS.md hierarchy) - backend/AGENTS.md → .github/skills/writing-csharp-code/SKILL.md - frontend/AGENTS.md → .github/skills/writing-typescript-code/SKILL.md - infra/AGENTS.md → .github/skills/writing-bicep-templates/SKILL.md - deployment/AGENTS.md → .github/skills/deploying-to-azure/SKILL.md - .github/instructions/*.instructions.md (3 files) → Consolidated into Skills ### New Skills (8 total) - deploying-to-azure: Deployment commands, phases, troubleshooting - researching-azure-ai-sdk: SDK research workflow, repository links - testing-with-playwright: Browser testing workflow, validation checklist - writing-csharp-code: C#/ASP.NET Core patterns, middleware pipeline - writing-typescript-code: TypeScript/React patterns, state management - writing-bicep-templates: Bicep standards, Container Apps config - implementing-chat-streaming: SSE patterns, action flow - troubleshooting-authentication: MSAL/JWT debugging, credential strategy ### Documentation Updates - copilot-instructions.md: Streamlined to essential rules + skill references - WebAppAgent.agent.md: Added subagent delegation strategy with token budgets - README.md: Updated VS Code setup section, added skills documentation - All README.md files: Updated references from AGENTS.md to SKILL.md ## Subagent Delegation Strategy Added comprehensive guidance for context-efficient operations: - When to delegate vs keep inline (decision tables) - Token cost estimates for operations (screenshots, file reads, etc.) - Prompt templates for research, testing, and deployment analysis - Result handling patterns for subagent responses ## VS Code Configuration (.vscode/settings.json) - Enabled Agent Skills (chat.useAgentSkills: true) - Enabled Claude skills compatibility - Enabled custom agents as subagents - Added terminal auto-approval for safe commands - Limited terminal scrollback to 500 lines for AI context efficiency ## VS Code Tasks (.vscode/tasks.json) Added dedicated dev server tasks with proper problem matchers: - Backend: ASP.NET Core API (dotnet watch with hot reload) - Frontend: React Vite (npm run dev with HMR) - Start Dev: Compound task running both in parallel - Install Frontend Dependencies: npm install with --legacy-peer-deps ## Minor Fixes - BuiltWithBadge.module.css: Prevent brand text wrapping (white-space/flex-wrap) ## Benefits 1. On-demand loading: Skills loaded only when relevant (vs always-loaded AGENTS.md) 2. Reduced token consumption: ~60% reduction in base context 3. Portable format: Skills work across VS Code, Copilot CLI, and coding agent 4. Subagent efficiency: Clear delegation patterns prevent context bloat 5. Better organization: Domain-specific guidance in dedicated files
## Summary Implement clickable inline citation markers that replace raw Azure AI Agent citation placeholders (e.g., 【4:0†source】) with superscript numbered badges. Citations link between inline markers and footnote references. ## New Components ### CitationMarker (frontend/src/components/chat/CitationMarker.tsx) - Superscript badge component for inline citation display - Keyboard accessible (Enter/Space to activate) - Tooltip shows citation label on hover - Memoized for rendering performance ### citationParser utility (frontend/src/utils/citationParser.ts) - Parses Azure AI Agent citation formats: - Assistants/Responses API: 【4:0†source】, 【13†myfile.pdf】 - Azure OpenAI On Your Data: [doc1], [doc2] - Deduplicates citations across message content - Maps textToReplace annotations to numbered [N] markers - Returns IndexedCitation array with consistent numbering ## Enhanced Components ### Markdown.tsx - Added annotations and onCitationClick props - New ContentWithCitations wrapper component - TextWithCitations custom paragraph renderer: - Splits text on [N] markers via regex - Renders CitationMarker for each reference - Falls back to plain <sup> when no click handler - Extracted shared rehypeSanitizeConfig and baseComponents ### AssistantMessage.tsx - Integrated parseContentWithCitations for consistent numbering - Added handleCitationClick callback: - URI citations: Opens URL in new tab - File citations: Smooth scrolls to footnote with highlight - Footnotes now have id attributes for scroll targeting - Added citationHighlight animation class - URI citations show external link icon (OpenRegular) - Clickable citations have hover/focus states ## UI/UX Improvements ### BuiltWithBadge relocation - Moved from AgentPreview (bottom-left absolute) to ChatInterface - Now centered below chat input area - Simplified layout: flex row instead of CSS grid - Removed arrow icon for cleaner appearance ### Citation footnote enhancements - Added transition for box-shadow and border-color - New .citationClickable class with hover effects - .citationHighlight animation: 2s pulse effect - .citationExternalIcon for URL citations ## Files Changed - frontend/src/components/AgentPreview.tsx (removed badge) - frontend/src/components/AgentPreview.module.css (removed styles) - frontend/src/components/ChatInterface.tsx (added badge) - frontend/src/components/ChatInterface.module.css (added badge style) - frontend/src/components/chat/AssistantMessage.tsx (citation logic) - frontend/src/components/chat/AssistantMessage.module.css (new styles) - frontend/src/components/chat/CitationMarker.tsx (new) - frontend/src/components/chat/CitationMarker.module.css (new) - frontend/src/components/core/BuiltWithBadge.tsx (simplified) - frontend/src/components/core/BuiltWithBadge.module.css (flex layout) - frontend/src/components/core/Markdown.tsx (citation rendering) - frontend/src/utils/citationParser.ts (new)
…ne hooks ## Major Changes ### Deployment Architecture - **BREAKING**: Removed .\deployment\scripts\deploy.ps1 custom deployment script - Replaced with standard �zd deploy command that uses predeploy hook - Added new predeploy.ps1 hook for container builds (runs before provision AND deploy) - Moved container build logic from postprovision to predeploy hook for cleaner separation ### Hook Lifecycle Updates - **preprovision.ps1**: Simplified to 145 lines (from 521), cleaner error handling - Streamlined output, removed verbose messaging - Auto-discovery of AI Foundry resources with interactive selection - Creates local dev configs (frontend/.env.local, backend/.env) - **postprovision.ps1**: Refocused on Entra + RBAC (90 lines vs 181) - Now only updates Entra app redirect URIs - Assigns Cognitive Services User role to Container App identity - Removed container build logic (moved to predeploy) - **predeploy.ps1**: New hook (79 lines) - Detects Docker availability (local build vs ACR cloud build) - Builds container with ENTRA_SPA_CLIENT_ID and ENTRA_TENANT_ID args - Updates existing Container App or skips if first provision - Sets SERVICE_WEB_IMAGE_NAME for Bicep - **postdown.ps1**: Compressed to 66 lines (from 163) - Now removes RBAC assignments before cleanup - Simplified Docker cleanup logic ### Deployment Modules Deleted - Removed deployment/scripts/build-and-deploy-container.ps1 (194 lines) - Logic split between predeploy hook and azd native deploy - Eliminates code duplication between hooks and deploy script ### Helper Modules Simplified - **Get-AIFoundryAgents.ps1**: Reduced to 37 lines (from 80) - Switched from curl to Invoke-RestMethod - Cleaner pagination handling - Better error messages - **New-EntraAppRegistration.ps1**: Reduced to 103 lines (from 237) - Removed verbose comments and error handling - Tighter validation logic - Consistent error formatting ### Infrastructure Changes - **main.bicep**: Removed role assignment module (done via CLI now) - Added comment explaining RBAC via postprovision hook prevents resource group tracking - Added WEB_IDENTITY_PRINCIPAL_ID output for hook usage - **main.parameters.json**: Cleaned up unused parameters - Removed AI_FOUNDRY_RESOURCE_GROUP and AI_FOUNDRY_RESOURCE_NAME - These are only used by postprovision hook, not Bicep - **Deleted**: infra/core/security/role-assignment.bicep (24 lines) - Role assignments now done via Azure CLI in postprovision.ps1 - Prevents azd from tracking external AI Foundry resource group ### Documentation Updates - **README.md**: Changed all .\deployment\scripts\deploy.ps1 references to �zd deploy - Updated deployment timing info - Removed infra-only pattern explanation (now standard azd workflow) - **deployment/README.md**: New build strategy section - Documents local Docker vs ACR cloud build fallback - Updated hook workflow diagram to show predeploy - **deployment/hooks/README.md**: Updated hook execution table - Added predeploy phase - Updated troubleshooting section - Better ENTRA_SERVICE_MANAGEMENT_REFERENCE guidance - **deployment/skills/deploying-to-azure/SKILL.md**: Consistent command references - All deployment commands now use �zd deploy - Updated hook descriptions ### Script Improvements - **deploy.ps1**: Now wrapper around �zd deploy (70 lines vs 130) - **list-agents.ps1**: Simplified to 38 lines (from 97) - **start-local-dev.ps1**: Compressed to 77 lines (from 339) - **validate-config.ps1**: Reduced to 50 lines (from 132) ### Benefits 1. **Standard azd workflow**: No custom deploy script needed 2. **Cleaner separation**: Hooks have single responsibilities 3. **Better RBAC**: CLI-based assignment prevents resource group deletion 4. **Less code**: ~1500 lines removed, improved maintainability 5. **Faster deploys**: predeploy runs in parallel with provision on first azd up ### Breaking Changes - .\deployment\scripts\deploy.ps1 removed - use �zd deploy instead - Hook output format changed (more concise) - RBAC now assigned in postprovision (was in Bicep before) ### Migration Guide **Before**: .\deployment\scripts\deploy.ps1 **After**: �zd deploy All functionality preserved, just using native azd commands.
## Summary Implement MCP (Model Context Protocol) tool approval UX and expand file attachments beyond images to include PDF and text-based documents. Fixes #15 and #14. ## New Components ### McpApprovalCard (frontend/src/components/chat/McpApprovalCard.tsx) - Displays tool approval requests with Approve/Reject buttons - Shows tool name, server label, and collapsible arguments - Keyboard accessible with fade-in animation - Uses CopilotMessage for consistent agent avatar styling ### McpApprovalRequest models (backend + frontend) - Backend: StreamChunk.McpApprovalRequest record - Frontend: IMcpApprovalRequest interface in chat.ts - Includes id, toolName, serverLabel, arguments, previousResponseId ## Enhanced Components ### AgentFrameworkService.cs - StreamMessageAsync extended with file, approval parameters - Detects McpToolCallApprovalRequestItem in streaming response - Handles approval continuation via previousResponseId - BuildUserMessage() processes both images and documents: - Text-based files inlined as context with filename markers - PDFs sent via CreateInputFilePart - New MIME type constants for validation ### ChatService.ts - New sendMcpApproval() method for approval flow - prepareMessagePayload separates images from documents - Handles mcpApprovalRequest SSE event type - constructRequestBody includes fileDataUris ### fileAttachments.ts - getEffectiveMimeType() with extension fallback for .md, .csv, etc. - validateDocumentFile() for PDF, TXT, MD, CSV, JSON, HTML, XML - validateFile() unified validator for all types - Increased limits: 20MB for documents, 10 total files ### FilePreview.tsx - Text content preview for text-based files - Type-specific icons (PDF, code, text, document) - Stable file key using name+size+lastModified - Cleanup of stale previews on file list change ### ChatInterface.tsx - Added onMcpApproval callback prop - Added conversationId prop for approval flow - Renders McpApprovalCard for approval-role messages ### appReducer.ts - New CHAT_MCP_APPROVAL_REQUEST action handler - Creates approval message with unique ID - Sets status to idle but keeps input disabled until decision ## Files Changed - backend/WebApp.Api/Models/ChatRequest.cs - backend/WebApp.Api/Models/StreamChunk.cs - backend/WebApp.Api/Program.cs - backend/WebApp.Api/Services/AgentFrameworkService.cs - frontend/src/types/chat.ts - frontend/src/types/appState.ts - frontend/src/reducers/appReducer.ts - frontend/src/services/ChatService.ts - frontend/src/utils/fileAttachments.ts - frontend/src/utils/sseParser.ts - frontend/src/components/chat/FilePreview.tsx - frontend/src/components/chat/ChatInput.tsx - frontend/src/components/chat/McpApprovalCard.tsx (new) - frontend/src/components/chat/McpApprovalCard.module.css (new) - frontend/src/components/ChatInterface.tsx - frontend/src/components/AgentPreview.tsx - README.md - .github/skills/writing-csharp-code/SKILL.md
## Summary Implement a complete custom agent system for AI-assisted development with 5 specialized agents, workflow handoffs between agents, and documentation improvements. ## New Components ### Commit.agent.md (.github/agents/) - Git commit automation following conventional commit standards - Reviews staged changes via git diff --staged - Generates detailed commit messages with Summary, New Components, Files Changed sections - Handoff to Web App Agent when more changes needed ### Docs.agent.md (.github/agents/) - Documentation review and quality assurance agent - Audits README, SKILL.md, and agent.md files for consistency - Validates YAML frontmatter and cross-references - Handoff to Web App Agent for implementing fixes ### Plan.agent.md (.github/agents/) - Read-only planning and research mode - Generates structured implementation plans (7 sections) - References skill files for project patterns - Handoff to Web App Agent for implementation ### Triage.agent.md (.github/agents/) - GitHub issue and PR analysis using gh CLI (read-only) - Categorizes by priority, type, and complexity - Suggests labels and next steps - Handoff to Plan Feature agent (never skips to implementation) ### frontend/README.md (new) - Comprehensive React + TypeScript + Vite documentation - Component architecture and state flow - Development setup and troubleshooting ## Enhanced Components ### WebAppAgent.agent.md - Added argument-hint for invocation guidance - Added 4 handoff definitions: Plan Feature, Test in Browser, Check Docs, Create Commit - Reordered YAML frontmatter for consistency ### copilot-instructions.md - Added Agents table with purpose and when to use - Documented workflow chain: Review Issues -> Plan Feature -> Web App Agent -> Review Docs -> Git Commit ### README.md - Fixed broken reference to frontend/README.md (removed "if present" qualifier) ## Files Changed - .github/agents/Commit.agent.md (new) - .github/agents/Docs.agent.md (new) - .github/agents/Plan.agent.md (new) - .github/agents/Triage.agent.md (new) - .github/agents/WebAppAgent.agent.md - .github/copilot-instructions.md - README.md - frontend/README.md (new)
## Summary Add centralized logging module for deployment hooks and fix npm peer dependency issue that caused ACR cloud builds to fail with "Missing: yjs from lock file". ## Root Cause React 19 requires `--legacy-peer-deps` which skips automatic peer dependency installation. The `@fluentui-copilot/react-copilot` package chain depends on `@lexical/yjs` which has `yjs` as a peer dependency. Since peer deps aren't auto-installed, `npm ci` in Docker builds failed. ## New Components ### HookLogging.ps1 (deployment/hooks/modules/HookLogging.ps1) - Centralized logging module for azd lifecycle hooks - `Start-HookLog` creates timestamped transcript in `.azure/<env>/logs/` - `Stop-HookLog` ends transcript gracefully - Ensures each hook run is captured for debugging ## Enhanced Components ### All Hooks (preprovision, postprovision, predeploy, postdown) - Import and use HookLogging module - Output captured to `.azure/<env>/logs/<timestamp>-<hookname>.log` ### package.json - Added `yjs` as explicit dependency to satisfy `@lexical/yjs` peer requirement ## Files Changed - deployment/hooks/modules/HookLogging.ps1 (new) - deployment/hooks/preprovision.ps1 - deployment/hooks/postprovision.ps1 - deployment/hooks/predeploy.ps1 - deployment/hooks/postdown.ps1 - deployment/hooks/README.md - frontend/package.json - frontend/package-lock.json - README.md
## Summary Ensure npm dependencies are installed automatically when running the "Frontend: React Vite" VS Code task, fixing fresh clone scenarios where node_modules doesn't exist. ## Changes ### .vscode/tasks.json - Add dependsOn to "Frontend: React Vite" task requiring "Install Frontend Dependencies" to run first - Change install task presentation to silent/shared to reduce terminal noise when dependencies are already cached ## Files Changed - .vscode/tasks.json
Release the log file lock by calling Stop-HookLog before attempting to
delete .azure/{envName}, preventing 'file in use' errors during cleanup.
VS Code task 'Frontend: React Vite' now auto-installs npm dependencies, so manual npm install is no longer required for fresh clones.
## Summary Add two new specialized agents (SDK Research, Test Agent), introduce the validating-ui-features skill with comprehensive test procedures, and integrate Microsoft Agent Framework for simplified agent loading while keeping direct SDK for streaming. ## New Agents ### SDKResearch.agent.md (.github/agents/) - Analyzes SDK versions for backend (.NET) and frontend (npm) - Provides version check commands and NuGet/npm API endpoints - Structured report format with priority definitions - Handoff flow to Plan Feature for implementation ### TestAgent.agent.md (.github/agents/) - UI testing agent using Playwright browser automation - Quick reference for theme toggle, new chat, cancel stream, markdown, token usage - Console logging patterns for state verification - Links to validating-ui-features skill ## New Skill ### validating-ui-features (.github/skills/) - Step-by-step test procedures for 6 UI features - Test files: prompts, code samples, complex markdown, file uploads - Console evidence patterns for state verification - Troubleshooting guide ## Enhanced Components ### AgentFrameworkService.cs - Integrated Microsoft.Agents.AI.AzureAI extension methods - Uses GetAIAgentAsync() for simplified agent loading - Keeps direct ProjectResponsesClient for streaming (MCP/annotations) - Updated XML documentation explaining hybrid approach ### researching-azure-ai-sdk/SKILL.md - Documented Agent Framework usage patterns - Explains why direct SDK needed for streaming - Added hybrid approach rationale ## Files Changed - .github/agents/SDKResearch.agent.md (new) - .github/agents/TestAgent.agent.md (new) - .github/agents/WebAppAgent.agent.md - .github/copilot-instructions.md - .github/skills/implementing-chat-streaming/SKILL.md - .github/skills/researching-azure-ai-sdk/SKILL.md - .github/skills/validating-ui-features/SKILL.md (new) - .github/skills/validating-ui-features/test-files/* (new, 9 files) - .github/skills/writing-csharp-code/SKILL.md - backend/README.md - backend/WebApp.Api/Services/AgentFrameworkService.cs - backend/WebApp.Api/WebApp.Api.csproj
…references ## Summary Improve the preprovision hook's handling of multiple AI Foundry resources with better non-interactive mode detection and clearer user feedback. Also adds missing Related Skills sections to 3 skill files for consistency. Fixes #6. ## Enhanced Components ### preprovision.ps1 - Improved non-interactive terminal detection logic - Clearer output messages with consistent prefix style ([OK], [!]) - Default selection option when pressing Enter (defaults to [1]) - Better warning messages for non-interactive mode with fix instructions ### deployment/hooks/README.md - Added dedicated "Multiple AI Foundry Resources" troubleshooting section - Updated troubleshooting table with env var workaround ### Skill Files (3 files) - Added "Related Skills" cross-reference sections for consistency - deploying-to-azure, testing-with-playwright, writing-bicep-templates ## Files Changed - deployment/hooks/preprovision.ps1 - deployment/hooks/README.md - .github/skills/deploying-to-azure/SKILL.md - .github/skills/testing-with-playwright/SKILL.md - .github/skills/writing-bicep-templates/SKILL.md
…references ## Summary Improve the preprovision hook's handling of multiple AI Foundry resources with better non-interactive mode detection and clearer user feedback. Also adds missing Related Skills sections to 3 skill files for consistency. Fixes #6. ## Enhanced Components ### preprovision.ps1 - Improved non-interactive terminal detection logic - Clearer output messages with consistent prefix style ([OK], [!]) - Default selection option when pressing Enter (defaults to [1]) - Better warning messages for non-interactive mode with fix instructions ### deployment/hooks/README.md - Added dedicated "Multiple AI Foundry Resources" troubleshooting section - Updated troubleshooting table with env var workaround ### Skill Files (3 files) - Added "Related Skills" cross-reference sections for consistency - deploying-to-azure, testing-with-playwright, writing-bicep-templates ## Files Changed - deployment/hooks/preprovision.ps1 - deployment/hooks/README.md - .github/skills/deploying-to-azure/SKILL.md - .github/skills/testing-with-playwright/SKILL.md - .github/skills/writing-bicep-templates/SKILL.md
…s, packages ## Summary Major modernization of the foundry-agent-webapp sample repo. Consolidates 7 Copilot agents into 14+ skills, migrates Entra app registration from PowerShell scripts to Bicep (Microsoft Graph extension GA), adds Copilot hooks for commit/doc/test enforcement, creates ARCHITECTURE-FLOW.md, adds unit tests, and updates all packages to latest stable versions. ## Agents → Skills Migration - Deleted 7 agent .md files (.github/agents/) — replaced by skills - Created 9 new skills: committing-code, planning-features, reviewing-documentation, syncing-mcp-servers, testing-cli-compatibility, triaging-issues, understanding-architecture, writing-unit-tests-csharp, writing-unit-tests-typescript - Updated 5 existing skills: deploying-to-azure, researching-azure-ai-sdk, testing-with-playwright, validating-ui-features, writing-typescript-code ## Copilot Hooks (new) - commit-gate: blocks direct git commit, enforces committing-code skill - doc-sync: reminds to update ARCHITECTURE-FLOW.md on architecture changes - test-reminder: advisory reminder to run tests for staged changes ## Entra App → Bicep Migration - New infra/entra-app.bicep using Microsoft.Graph/applications@v1.0 - New infra/bicepconfig.json with Microsoft Graph v1.0 extension - Deleted deployment/hooks/modules/New-EntraAppRegistration.ps1 (159 lines) - Simplified preprovision.ps1 (removed Entra logic, kept AI Foundry discovery) - Enhanced postprovision.ps1 (identifierUri, redirect URIs, local config gen) - Fixed postdown.ps1 (robust azd env get-value error handling, name fallback) ## Architecture Documentation - Created ARCHITECTURE-FLOW.md (585 lines) — state machines, SSE event flow, file mappings, Mermaid diagrams ## Unit Tests (new) - backend: ErrorResponseFactoryTests.cs (MSTest) - frontend: appReducer.test.ts, citationParser.test.ts, fileAttachments.test.ts, sseParser.test.ts (Vitest) ## Package Updates - Backend: Agent Framework RC1, OpenTelemetry 1.15, Extensions 10.3 - Frontend: ESLint 10.0.2, Vitest 4.0.18, updated React 19 peer deps - Added frontend/.npmrc (legacy-peer-deps for React 19 compat) ## Infrastructure - Updated all Bicep API versions to 2024 stable - Deleted unused deployment/docker/backend.Dockerfile - Container App health probes made conditional on real image - ACR pull via managed identity (acrPull role, no admin credentials) - Enhanced predeploy.ps1 with ACR cloud build fallback ## Dev Experience - Added .vscode/launch.json for F5 debugging - Updated .vscode/settings.json and tasks.json - Added deployment/scripts/test-cli-compatibility.ps1 - Updated copilot-instructions.md with hooks, skills directory ## Files Changed - 91 files changed, 6739 insertions(+), 3267 deletions(-) Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…and security hardening
## Summary
Major update adding On-Behalf-Of authentication, MCP tool approval UI,
conversation history with pagination, Application Insights observability
(separate backend/frontend resources), upgraded Azure AI SDKs, and
comprehensive security/infrastructure fixes.
## New Components
### Observability
- Separate App Insights: appi-{token} (backend) and appi-fe-{token} (frontend)
- Azure.Monitor.OpenTelemetry.AspNetCore with Azure SDK tracing (Azure.*)
- Frontend @microsoft/applicationinsights-web with unhandled rejection tracking
- Request header tracking disabled to prevent Bearer token leakage
### ConversationSidebar.tsx, McpApprovalCard.tsx, entra-app.bicep
- Conversation history with deduplication and pagination
- MCP tool approval with resolved state and failure rollback
- Bicep Entra ID app registrations (SPA + conditional backend)
## Enhanced Components
### AgentFrameworkService.cs
- OBO credential flow with FIC assertion, cached per request
- MCP tool approval via conversation-bound client
- TryParseDataUri helper, v2 Agents API
### postprovision.ps1
- FIC creation, triple RBAC, fixed OData filter escaping
### postdown.ps1
- Cleans up all three RBAC roles
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Bridge the AI Foundry portal's "View sample app code" instructions with this app's configuration. The portal emits AZURE_EXISTING_* env vars that this repo previously ignored, causing confusion for users (fixes #19). - preprovision.ps1: detect portal vars from azd env or root .env file, map to AI_AGENT_ENDPOINT / AI_AGENT_ID / AI_AGENT_VERSION / AI_FOUNDRY_RESOURCE_NAME - AgentFrameworkService.cs: optional version pinning via AgentReference(name, version) - postprovision.ps1: pass AI_AGENT_VERSION through to backend .env - README.md: document portal compatibility with both input methods - AgentFrameworkServiceConfigTests.cs: 9 new tests for parsing and edge cases Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
## Summary When chat streaming fails, the system now automatically retries up to 3 times with exponential backoff and a visible retry indicator. If all retries are exhausted, the failed messages are removed from the chat and the original text is restored to the input box so the user can try again. ## New Components ### CHAT_STREAM_RETRY action (frontend/src/reducers/appReducer.ts) - Resets assistant message content for a fresh retry attempt - Sets retryAttempt/maxRetries on the message for UI indicator - Keeps chat status as 'streaming' with input disabled ### CHAT_RECOVER_MESSAGE action (frontend/src/reducers/appReducer.ts) - Removes the failed user message and assistant placeholder - Sets recoveredInput to restore the original text to the input box - Shows descriptive error with retry count ### CHAT_CONSUMED_RECOVERED_INPUT action (frontend/src/reducers/appReducer.ts) - Clears recoveredInput after the input component consumes it ## Enhanced Components ### chatService.ts - Replaced HTTP-only retry (retryWithBackoff on initiateStream) with full-stream retry loop that retries the entire POST + processStream cycle up to 3 times - On final failure, dispatches CHAT_RECOVER_MESSAGE instead of CHAT_ERROR to clean up and restore the user's message - Auth errors bypass retry and fail immediately ### AssistantMessage.tsx - Shows "Retrying (2/3)..." spinner indicator when retryAttempt is set - Spinning ArrowSyncRegular icon with attempt count text ### ChatInput.tsx - Accepts recoveredInput prop to pre-fill input after failed retries - Focuses the input after restoration ### appReducer.ts - CHAT_STREAM_COMPLETE now clears retryAttempt/maxRetries on success - CHAT_CLEAR_ERROR and CHAT_CLEAR now clear recoveredInput ### appState.ts - Added recoveredInput field to chat state - Added 3 new action types for retry/recovery flow ### chat.ts - Added retryAttempt and maxRetries fields to IChatItem ### ChatInterface.tsx / AgentPreview.tsx - Wired recoveredInput and onRecoveredInputConsumed through the component tree ### ARCHITECTURE-FLOW.md - Updated chat state machine with CHAT_STREAM_RETRY and CHAT_RECOVER_MESSAGE transitions - Added retry/recovery documentation section - Updated action reference table with new actions ## Files Changed - ARCHITECTURE-FLOW.md - frontend/src/components/AgentPreview.tsx - frontend/src/components/ChatInterface.tsx - frontend/src/components/chat/AssistantMessage.module.css - frontend/src/components/chat/AssistantMessage.tsx - frontend/src/components/chat/ChatInput.tsx - frontend/src/reducers/appReducer.ts - frontend/src/services/chatService.ts - frontend/src/types/appState.ts - frontend/src/types/chat.ts Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
## Summary Allow users to type and send messages while the AI is streaming a response. Queued messages appear as dismissible chips below the input and auto-send (combined into one message) when the stream completes. ## New Components ### MessageQueue (frontend/src/components/chat/MessageQueue.tsx) - Renders queued messages as dismissible Tag chips - Accessible with role="list" and aria-labels - Truncates long messages to 60 chars with ellipsis ## Enhanced Components ### appState.ts - Added `pendingMessages: string[]` to chat state - Added CHAT_QUEUE_MESSAGE, CHAT_DEQUEUE_MESSAGE, CHAT_CLEAR_QUEUE actions ### appReducer.ts - Added queue action handlers (append, remove by index, clear) - CHAT_START_STREAM now keeps input enabled for message queueing - CHAT_CLEAR and CHAT_LOAD_CONVERSATION clear the queue ### AgentChat.tsx - handleSendMessage queues messages during streaming instead of sending - useEffect drains queue on idle by combining messages (newline-separated) ### ChatInterface.tsx - isBusy no longer includes streaming state (input stays enabled) - Passes pendingMessages and onDequeueMessage to ChatInput ### ChatInput.tsx - Input no longer disabled during streaming - Renders MessageQueue chips when messages are queued ### appReducer.test.ts - Added tests for CHAT_QUEUE_MESSAGE, CHAT_DEQUEUE_MESSAGE, CHAT_CLEAR_QUEUE - Added tests for queue cleared on CHAT_CLEAR and CHAT_LOAD_CONVERSATION - Updated CHAT_START_STREAM test to expect input enabled - Updated state shape snapshot with pendingMessages ### ARCHITECTURE-FLOW.md - Updated streaming state to show input enabled - Added Message Queue section - Added queue actions to action reference table ## Files Changed - ARCHITECTURE-FLOW.md - frontend/src/components/AgentChat.tsx - frontend/src/components/ChatInterface.tsx - frontend/src/components/chat/ChatInput.tsx - frontend/src/components/chat/MessageQueue.module.css - frontend/src/components/chat/MessageQueue.tsx - frontend/src/reducers/__tests__/appReducer.test.ts - frontend/src/reducers/appReducer.ts - frontend/src/types/appState.ts Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
## Summary Fixes bugs and stale references introduced during the retry, queue, and predeploy debugging iterations. ## Enhanced Components ### appReducer.ts - Fixed CHAT_STREAM_RETRY setting chatInputEnabled to false — should be true to match the message queue feature (input stays enabled during all streaming states including retries) ### appReducer.test.ts - Updated CHAT_STREAM_RETRY test to expect chatInputEnabled=true - Renamed test from "disables input" to "keeps input enabled" ### ARCHITECTURE-FLOW.md - Fixed UI State Derivation flowchart: streaming now maps to ✅ Enabled (was incorrectly showing ❌ Disabled) - Added missing CHAT_LOAD_CONVERSATION to action reference table ### predeploy.ps1 - Fixed ACR cloud build failure caused by unescaped semicolons in APPLICATIONINSIGHTS_FRONTEND_CONNECTION_STRING build arg — semicolons are shell command separators in ACR's Linux-side Docker invocation. Bug introduced in commit 51c098b when App Insights was added as a build arg. ### MessageQueue.tsx + MessageQueue.module.css - Replaced Fluent UI Tag component with Button+Text chip — Tag's dismissible API doesn't exist in the project's Fluent UI version ### doc-sync.ps1, SKILL.md, frontend/README.md - Updated stale AgentPreview references to AgentChat ## Files Changed - .github/hooks/scripts/doc-sync.ps1 - .github/skills/writing-typescript-code/SKILL.md - ARCHITECTURE-FLOW.md - deployment/hooks/predeploy.ps1 - frontend/README.md - frontend/src/components/chat/MessageQueue.module.css - frontend/src/components/chat/MessageQueue.tsx - frontend/src/reducers/__tests__/appReducer.test.ts - frontend/src/reducers/appReducer.ts Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…bility
Add 14 UI features, code interpreter file download, and comprehensive
accessibility pass.
## Message Actions
- Copy, regenerate, edit last user message, 👍👎 feedback (App Insights)
- Code block copy button with checkmark animation feedback
## Tool-Use Visualization
- Backend streams toolUse SSE events for file_search, code_interpreter, function_call
- Frontend shows inline spinner ("Running code…", "Searching files…")
- Renders both before content (replaces loading dots) and mid-stream below content
## Code Interpreter File Download
- Container files use REST API: GET /containers/{containerId}/files/{fileId}/content
- IHttpClientFactory for connection pooling, URL-encoded path segments
- Inline sandbox: links match annotations by filename → clickable downloads
- Sandbox images hidden (broken image prevention)
- Firefox-compatible download (DOM-appended anchor, deferred URL revoke)
- Download errors surface via CHAT_ERROR with retry guidance
## Voice Input
- Web Speech API mic button with pulsing indicator and aria-pressed
- Feature detection with graceful fallback toast
## Conversation UX
- Drag-and-drop file upload with accessible drop zone overlay
- Keyboard shortcuts dialog (⌨️ toolbar button)
- Client-side conversation search with debounced filtering
- Export conversation as Markdown
- Smart auto-scroll with IntersectionObserver + "↓ New messages" pill
- Message queue during streaming (preserves file attachments)
- Stream retry with 3x exponential backoff and message recovery
- Toolbar reorganized: 4 primary + ⋯ overflow menu (History, Export, Shortcuts, Settings)
## Edit Message
- Pops text back to input with undo capability
- Cancel via toolbar stop button (dual-purpose: cancel stream or cancel edit)
## Paragraph & Code Rendering
- Fixed paragraph display: block with proper 8px margin spacing
- Code block overflow-x: auto with horizontal scroll
- Inline code styling preserved
## Accessibility (10 fixes)
- Loading dots / tool indicator: role="status" with aria-labels
- Citations: role="button" with descriptive aria-labels
- VoiceInput: aria-pressed toggle state
- File input: aria-label="Upload files"
- New messages pill: aria-label
- DropZone: role="status" aria-live="polite", decorative icon aria-hidden
- Copy feedback: aria-live="polite" on "Copied!" text
- Sidebar delete: visible on focus-within (not just hover)
- FilePreview: aria-hidden on decorative file type icons
## Backend
- AnnotationInfo: added ContainerId property
- ContainerFileCitationMessageAnnotation: captures ContainerId
- FilePathMessageAnnotation: uses actual filename (not "Generated File")
- /api/files/{fileId}: accepts containerId query param
- HttpRequestException mapped to upstream status (not always 500)
- WriteAnnotationsEvent: serializes containerId in SSE
- Conversation messages reversed to chronological order
## Code Review Fixes
- VoiceInput ref leak on unmount
- Regenerate duplicate user messages
- editSnapshot cross-conversation bug
- O(N²) message rendering → useDeferredValue
- findAnnotationByFilename → pre-computed Map for O(1) lookups
## Documentation
- ARCHITECTURE-FLOW.md: new SSE events, actions, endpoints, toolbar layout
- SDK skill: ContainerId property, container file REST download pattern
- Frontend README: toolbar overflow menu documentation
## Tests
- 16 new reducer tests (174 total): CHAT_REGENERATE, CHAT_EDIT_MESSAGE,
CHAT_CONSUMED_REGENERATE, CHAT_STREAM_TOOL_USE, CHAT_STREAM_COMPLETE
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
## Summary Add detection for incomplete `azd up` setup across four layers — Vite dev server, preToolUse hook, VS Code task, and agent skill — so both humans and AI agents get clear guidance instead of cryptic errors. Add devcontainer for GitHub Codespaces. Fix predeploy hook env resolution. Fixes #23. Fixes #24. ## New Components ### envCheckPlugin (frontend/plugins/envcheck.ts) - Vite plugin that checks VITE_ENTRA_SPA_CLIENT_ID and VITE_ENTRA_TENANT_ID at dev server startup - Serves a styled HTML error page with fix instructions when vars are missing - Passes through /@, /__, and /api prefixed URLs for HMR and proxy - Only activates in serve mode — production builds are unaffected ### setup-check.ps1 (.github/hooks/scripts/setup-check.ps1) - preToolUse hook for AI agents running dev commands - Context-aware: npm/vite commands check frontend env, dotnet commands check backend env (including AI_AGENT_ENDPOINT, AI_AGENT_ID), start-local-dev checks both - Advisory only — warns but does not block - Exits silently for non-terminal tools and non-dev commands ### validating-local-setup skill (.github/skills/validating-local-setup/SKILL.md) - Explains what the AI Foundry portal provides vs what azd up creates - Lists all required env vars for frontend and backend - Documents common error patterns with causes and fixes - Includes agent-specific pre-flight checklist ### devcontainer.json (.devcontainer/devcontainer.json) - .NET 9 base image with Node 22, azd, Azure CLI, PowerShell - VS Code extensions: C# Dev Kit, Azure Dev, ESLint, Copilot - Port forwarding for 5173 and 8080 - postCreateCommand runs dotnet restore and npm install ## Enhanced Components ### README.md - Added Foundry portal callout at top explaining the portal-vs-azd relationship - Added Codespaces section with Conditional Access policy warning - Added Setup Detection section documenting all four detection layers - Expanded "Coming from the AI Foundry Portal" with explicit what-portal-gives vs what-azd-adds - Added Validate Configuration to tasks table and validating-local-setup to skills list ### predeploy.ps1 (deployment/hooks/predeploy.ps1) - Added Get-AzdValue helper that falls back to $env: vars when azd env get-value fails in hook subprocesses - Fixes deploy failure when azd subprocess can't locate azure.yaml ### commit-gate.json (.github/hooks/commit-gate.json) - Added setup-check.ps1 to preToolUse array (after commit-gate, before test-reminder) ### tasks.json (.vscode/tasks.json) - Added Validate Configuration task running deployment/scripts/validate-config.ps1 ### vite.config.ts (frontend/vite.config.ts) - Registered envCheckPlugin in Vite plugins array ## Files Changed - .devcontainer/devcontainer.json - .github/hooks/commit-gate.json - .github/hooks/scripts/setup-check.ps1 - .github/skills/validating-local-setup/SKILL.md - .vscode/tasks.json - README.md - deployment/hooks/predeploy.ps1 - frontend/plugins/envcheck.ts - frontend/vite.config.ts Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
## Summary
Flattens three in-flight changes into one release:
1. Migrate from preview Azure AI packages to the GA `Azure.AI.Agents.Persistent` /
`Azure.AI.Projects` / `Microsoft.Agents.AI.*` stack, including the switch from
base64 image data URIs to the Foundry Files API for image attachments.
2. Upgrade the backend toolchain from .NET 9 to .NET 10 (GA), including SDK,
runtime images, and project targets.
3. Add an in-app "Uploaded images" cleanup tool in the Settings panel so users can
delete images this web app uploaded to the Foundry project, since the GA SDK
does not expose a typed `expires_after` parameter on file uploads.
Also adds an MIT `LICENSE` file and refreshes docs/skills for the GA APIs,
.NET 10, and the new cleanup UX.
## New Components
### UploadedFilesModels (backend/WebApp.Api/Models/UploadedFilesModels.cs)
- `UploadedFilesInfo(int Count, long TotalBytes)` — DTO returned by the list endpoint.
- `UploadedFilesCleanupResult(int Deleted, int Failed)` — DTO returned by cleanup.
### UploadedFilesPrefixTests (backend/WebApp.Api.Tests/UploadedFilesPrefixTests.cs)
- Locks the `webapp-upload-` filename prefix as a regression guard.
- Verifies `StartsWith` scoping semantics and that legacy `image-{guid}` names
are intentionally excluded from cleanup.
### LICENSE
- Adds MIT license text (addresses #25).
## Enhanced Components
### AgentFrameworkService.cs
- Migrated to GA `Azure.AI.Agents.Persistent` + `Azure.AI.Projects` +
`Microsoft.Agents.AI.*`; replaced preview tool-call/thread plumbing with the
GA equivalents.
- Switched image attachments from base64 data URIs to `ProjectFilesClient`
uploads with `FileUploadPurpose.Assistants`, and reference them as message
image-file content parts.
- Added `public const WebAppUploadFilenamePrefix = "webapp-upload-"` and use it
when generating upload filenames (`{prefix}{guid:N}{ext}`) so our files can
be identified later.
- Added `ListUploadedFilesAsync` and `CleanupUploadedFilesAsync` that enumerate
`FilePurpose.Assistants` files, filter to the prefix, and aggregate
size/delete results with per-file error handling.
- Clarified `AI_AGENT_VERSION` semantics in code: expanded XML doc on
`_configuredAgentVersion` to describe pinning behavior and Foundry's version
retention, and added a `pinned=true/false` field to the "Loaded agent" log
line so operators can tell which path is in use (addresses #26).
### Program.cs
- Added `GET /api/files/uploaded` (returns `UploadedFilesInfo`) and
`POST /api/files/cleanup` (returns `UploadedFilesCleanupResult`) endpoints,
registered before `MapFallbackToFile` so literal segments take precedence
over the existing `GET /api/files/{fileId}` route.
### SettingsPanel.tsx
- Accepts a `chatService` prop and loads the uploaded-image count when opened.
- Adds a Fluent `Dialog` confirmation with a red destructive "Delete N image(s)"
button and a primary Cancel, guarded by `disabled={cleaning}` to prevent
double-submits.
- Inline `Spinner` while loading/cleaning; status line reports deleted/failed
counts and auto-dismisses successful status after 4s (errors persist).
- Image-specific copy throughout ("Uploaded images", singular/plural counts,
concise hint).
### chatService.ts
- Adds `getUploadedFilesInfo()` and `cleanupUploadedFiles()` client methods
wrapping the new backend endpoints with MSAL-authenticated fetches.
### AgentChat.tsx
- Passes `chatService` through to `SettingsPanel` so the new cleanup UI can
call the backend.
### Backend project files
- `WebApp.Api.csproj` / `WebApp.ServiceDefaults.csproj` / `WebApp.Api.Tests.csproj`:
bumped to `net10.0` and upgraded to GA package versions.
- `deployment/docker/frontend.Dockerfile`: SDK and runtime images bumped to
`mcr.microsoft.com/dotnet/sdk:10.0` / `aspnet:10.0-alpine` (the backend-stage
toolchain; the repo builds both tiers from this single Dockerfile).
### Frontend package set
- `package.json` / `package-lock.json`: refreshed React 19 / MSAL / Fluent UI
dependency tree; regenerated lockfile.
### Documentation & skills
- `README.md`: rewrote the "Known Limitations" section to describe the in-app
cleanup and the GA SDK `expires_after` gap.
- `.github/skills/researching-azure-ai-sdk/SKILL.md`: updated to reflect GA
package names, image-file attachment pattern, and file lifecycle.
- `.github/skills/writing-csharp-code/SKILL.md`,
`.github/skills/deploying-to-azure/SKILL.md`,
`.github/skills/implementing-chat-streaming/SKILL.md`,
`.github/skills/understanding-architecture/SKILL.md`,
`.github/copilot-instructions.md`, `ARCHITECTURE-FLOW.md`, `backend/README.md`:
minor updates for .NET 10 and GA APIs.
- `deployment/scripts/start-local-dev.ps1`, `.devcontainer/devcontainer.json`:
.NET 10 toolchain alignment.
## Files Changed
- .devcontainer/devcontainer.json
- .github/copilot-instructions.md
- .github/skills/deploying-to-azure/SKILL.md
- .github/skills/implementing-chat-streaming/SKILL.md
- .github/skills/researching-azure-ai-sdk/SKILL.md
- .github/skills/understanding-architecture/SKILL.md
- .github/skills/writing-csharp-code/SKILL.md
- ARCHITECTURE-FLOW.md
- LICENSE
- README.md
- backend/README.md
- backend/WebApp.Api.Tests/UploadedFilesPrefixTests.cs
- backend/WebApp.Api.Tests/WebApp.Api.Tests.csproj
- backend/WebApp.Api/Models/UploadedFilesModels.cs
- backend/WebApp.Api/Program.cs
- backend/WebApp.Api/Services/AgentFrameworkService.cs
- backend/WebApp.Api/WebApp.Api.csproj
- backend/WebApp.ServiceDefaults/WebApp.ServiceDefaults.csproj
- deployment/docker/frontend.Dockerfile
- deployment/scripts/start-local-dev.ps1
- frontend/package-lock.json
- frontend/package.json
- frontend/src/components/AgentChat.tsx
- frontend/src/components/core/SettingsPanel.tsx
- frontend/src/services/chatService.ts
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Updated .NET packages:
Updated npm packages:
Fixed 2 npm security vulnerabilities (js-yaml, mdast-util-to-hast)
All packages now up to date with 0 known vulnerabilities