feat(payload-ai): implement context-aware Payload CMS Agent

- ChatWindow now gathers page context (URL, collectionSlug, document ID)
- chatEndpoint fetches real AIChatPermissions from database
- Agent uses OpenRouter Gemini 3 Flash with maxSteps: 10 for autonomous multi-step tool execution
- Fallback default collections when no permissions configured
This commit is contained in:
2026-03-06 00:55:39 +01:00
parent 560213680c
commit cbed10052b
2 changed files with 81 additions and 13 deletions

View File

@@ -1,6 +1,6 @@
'use client'
import React, { useState } from 'react'
import React, { useState, useEffect } from 'react'
import { useChat } from '@ai-sdk/react'
import './ChatWindow.scss'
@@ -15,10 +15,38 @@ export const ChatWindowProvider: React.FC<{ children: React.ReactNode }> = ({ ch
const ChatWindow: React.FC = () => {
const [isOpen, setIsOpen] = useState(false)
const [pageContext, setPageContext] = useState<any>({ url: '' })
useEffect(() => {
if (typeof window !== 'undefined') {
const path = window.location.pathname;
let collectionSlug = null;
let id = null;
// Payload admin URLs are usually /admin/collections/:slug/:id
const match = path.match(/\/collections\/([^/]+)(?:\/([^/]+))?/);
if (match) {
collectionSlug = match[1];
if (match[2] && match[2] !== 'create') {
id = match[2];
}
}
setPageContext({
url: window.location.href,
title: document.title,
collectionSlug,
id
})
}
}, [isOpen]) // Refresh context when chat is opened
// @ts-ignore - AI hook version mismatch between core and react packages
const { messages, input, handleInputChange, handleSubmit, setMessages } = useChat({
api: '/api/mcp-chat',
initialMessages: []
initialMessages: [],
body: {
pageContext
}
} as any)
// Basic implementation to toggle chat window and submit messages
@@ -51,8 +79,8 @@ const ChatWindow: React.FC = () => {
position: 'fixed',
bottom: '80px',
right: '20px',
width: '400px',
height: '600px',
width: '450px',
height: '650px',
backgroundColor: '#fff',
border: '1px solid #eaeaea',
borderRadius: '12px',