Skip to content

feat: add DIFM conversational chat interface#15

Open
louwie17 wants to merge 1 commit intotrunkfrom
feat/difm-today-page
Open

feat: add DIFM conversational chat interface#15
louwie17 wants to merge 1 commit intotrunkfrom
feat/difm-today-page

Conversation

@louwie17
Copy link
Copy Markdown
Contributor

@louwie17 louwie17 commented May 1, 2026

Summary

  • Adds a Bring Your Own Key AI chat assistant under WooCommerce → Hey Woo! — merchants paste an Anthropic API key in Settings and get a conversational interface without needing Claude Desktop or MCP
  • On each chat message, PHP fetches a 1-hour-cached store context snapshot (revenue, orders, refunds, customers, top-10 products) via the existing analytics abilities and injects it into Claude's system prompt — so answers are grounded in real store data rather than hallucinated
  • The UI is a full-height React chat built with @wordpress/scripts (webpack), rendering inside the standard WooCommerce admin chrome

What's included

PHP

  • includes/difm/class-anthropic-client.php — thin wp_remote_post wrapper; constant-first key priority chain (HEY_WOO_ANTHROPIC_KEY > wp_options); validate_key() called on settings save
  • includes/difm/class-difm-rest-controller.phpPOST /hey-woo/v1/difm/chat + POST /hey-woo/v1/difm/key/validate; store context fetched and cached per-day
  • includes/difm/class-difm-admin-page.php — WooCommerce submenu page that enqueues the React bundle via wp_enqueue_script()
  • includes/settings/class-settings-page.php — new DIFM section with password field for the API key

TypeScript / React (packages/today/src/)

  • useChat.ts hook — manages message history, sending state, and REST calls
  • App.tsx — chat layout: header, scrollable role="log" message list, typing indicator, inline error bar
  • ChatBubble, ChatInput, NoKey, Loading, Error components
  • style.scss — scoped chat styles (.hey-woo-page, .hey-woo-bubble, .hey-woo-typing-indicator, etc.)

Tests

  • tests/integration/test-anthropic-client.php — key priority chain, validate_key() with mocked HTTP
  • tests/integration/test-difm-rest-controller.php — route registration, permission checks, no_key response, chat reply flow

Test plan

  • Add an Anthropic API key under WooCommerce → Settings → Hey Woo — should validate on save and show a success notice
  • Navigate to WooCommerce → Hey Woo! — chat interface loads inside normal WC admin chrome
  • Ask "what are my top products this month?" — Claude should answer with real product names and revenue figures from the store
  • Ask "what were my sales last week?" — should cite actual revenue numbers, not say data is unavailable
  • Leave API key empty — navigating to the page should show the NoKey setup prompt with a link to Settings
  • Run ./bin/check — 274 tests pass, PHPCS clean

🤖 Generated with Claude Code

Adds a server-side AI chat assistant (Do It For Me tier) that lets
merchants ask questions about their store using a Bring Your Own Key
Anthropic API key — no Claude Desktop or MCP setup required.

Key pieces:
- AnthropicClient: thin wp_remote_post wrapper for the Anthropic
  messages API, with constant-first key priority chain and a cheap
  validate_key() call on settings save.
- DifmRestController: POST /hey-woo/v1/difm/chat endpoint that fetches
  a 1-hour-cached store context snapshot (revenue, orders, refunds,
  customers, top-10 products via existing analytics abilities) and
  injects it as JSON into the Claude system prompt so answers are
  grounded in real store data.
- DifmAdminPage: WooCommerce submenu page (Hey Woo!) that enqueues the
  React chat UI via @wordpress/scripts / wp_enqueue_script().
- React chat UI (TypeScript + SCSS, webpack via @wordpress/scripts):
  full-height scrollable message history, typing indicator, inline
  error bar with Dismiss, Enter-to-send compose bar.
- Settings: password field for the Anthropic API key with key
  validation on save and constant-override support.
- Integration tests for AnthropicClient and DifmRestController.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant