feat: Merge PR features with test-IDs from Optimizecodecloudagents

[dsactivi-2]

Summary

Merged features from Optimizecodecloudagents PRs #2, #4, #7 with proper test-IDs.

New Components

• ThemeProvider.tsx - Dark/light/system theme switching with localStorage persistence
• ThemeToggle.tsx - Dropdown button for theme selection

Updated Components

• AgentCard.tsx - Added:

  • spokenLanguage support (de/en/bs/sr)
  • agentType (standard/influencer)
  • contentAutonomy badge
  • Influencer styling (purple gradient)
  • All test-IDs preserved and extended

• CreateAgentDialog.tsx - Added:

  • Spoken language selector
  • Agent type selector (Standard/Influencer)
  • Content autonomy switch (auto-enabled for influencer)
  • All test-IDs preserved and extended

New Documentation

• docs/AGENT_CONTROL.md - Complete API documentation for agent control endpoints

Test-IDs

All components follow naming convention: cloudagents.{component}.{element}.{action}

Examples:

• cloudagents.theme.toggle.button
• cloudagents.agent.create.name.input
• cloudagents.agent.{id}.badge.influencer

Source PRs (Optimizecodecloudagents)

• PR feat(github): GitHub Client & REST API Integration #2: ThemeProvider, ThemeToggle
• PR docs(readme): Developer Guide & Documentation #4: Influencer agent type, Serbian language, content autonomy
• PR feat(agent-control): Agent Control API #7: AGENT_CONTROL.md

Changes

• 5 files changed
• 971 insertions, 22 deletions

Test Plan

• TypeScript build passes
• Pre-commit checks pass
• Manual test theme switching
• Manual test agent creation with new fields

🤖 Generated with Claude Code

[sentry]

Bug: The UsersPage component expects a raw stats object from usersApi.stats(), but the API returns a wrapped object { success, stats }. This mismatch will cause stats cards to display undefined.
_{Severity: HIGH | Confidence: High}

🔍 Detailed Analysis

The usersApi.stats() endpoint returns a wrapped response object: { success: boolean, stats: { ... } }. However, the UsersPage component at lines 94-99 incorrectly assumes the API returns the raw stats object directly. The statsRes variable is assigned the wrapped object, and setStats(statsRes) stores this incorrect structure in the component's state. When the component later attempts to render properties like stats.total or stats.active, it accesses properties on the wrapped object, resulting in undefined values and breaking the user statistics display cards.

💡 Suggested Fix

In UsersPage.tsx, update the handling of the statsRes to correctly unwrap the nested stats object before calling setStats. For example: setStats(statsRes.stats). This will align the component's state with the data structure used for rendering.

🤖 Prompt for AI Agent

Review the code at the location below. A potential bug has been identified by an AI
agent.
Verify if this is a real issue. If it is, propose a fix; if not, explain why it's not
valid.

Location: src/components/UsersPage.tsx#L94-L99

Potential issue: The `usersApi.stats()` endpoint returns a wrapped response object: `{
success: boolean, stats: { ... } }`. However, the `UsersPage` component at lines 94-99
incorrectly assumes the API returns the raw `stats` object directly. The `statsRes`
variable is assigned the wrapped object, and `setStats(statsRes)` stores this incorrect
structure in the component's state. When the component later attempts to render
properties like `stats.total` or `stats.active`, it accesses properties on the wrapped
object, resulting in `undefined` values and breaking the user statistics display cards.

_{Did we get this right? 👍 / 👎 to inform future reviews.
Reference ID: 508565}

[dsactivi-2]

Replaced by clean PR - original branch had merge conflicts with old commits

[dsactivi-2]

n