Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 6s
Build & Deploy / 🧪 QA (push) Failing after 58s
Build & Deploy / 🏗️ Build (push) Has been skipped
Build & Deploy / 🚀 Deploy (push) Has been skipped
Build & Deploy / 🧪 Post-Deploy Verification (push) Has been skipped
Build & Deploy / 🔔 Notify (push) Successful in 2s
132 lines
7.2 KiB
Diff
132 lines
7.2 KiB
Diff
diff --git a/dist/components/ChatWindow/index.js b/dist/components/ChatWindow/index.js
|
|
index 90c65bae4abb78beec98d8308e808e8ba341dcc2..f675dbc69ff82b64438288f53599c93a56391b64 100644
|
|
--- a/dist/components/ChatWindow/index.js
|
|
+++ b/dist/components/ChatWindow/index.js
|
|
@@ -2,7 +2,6 @@
|
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
import { useState } from 'react';
|
|
import { useChat } from '@ai-sdk/react';
|
|
-import './ChatWindow.scss';
|
|
export const ChatWindowProvider = ({ children }) => {
|
|
return (_jsxs(_Fragment, { children: [children, _jsx(ChatWindow, {})] }));
|
|
};
|
|
@@ -14,47 +13,63 @@ const ChatWindow = () => {
|
|
initialMessages: []
|
|
});
|
|
// Basic implementation to toggle chat window and submit messages
|
|
- return (_jsxs("div", { className: "payload-mcp-chat-container", children: [_jsx("button", { className: "payload-mcp-chat-toggle", onClick: () => setIsOpen(!isOpen), style: {
|
|
- position: 'fixed',
|
|
- bottom: '20px',
|
|
- right: '20px',
|
|
- zIndex: 9999,
|
|
- padding: '12px 24px',
|
|
- backgroundColor: '#000',
|
|
- color: '#fff',
|
|
- borderRadius: '8px',
|
|
- border: 'none',
|
|
- cursor: 'pointer',
|
|
- fontWeight: 'bold'
|
|
- }, children: isOpen ? 'Close AI Chat' : 'Ask AI' }), isOpen && (_jsxs("div", { className: "payload-mcp-chat-window", style: {
|
|
- position: 'fixed',
|
|
- bottom: '80px',
|
|
- right: '20px',
|
|
- width: '400px',
|
|
- height: '600px',
|
|
- backgroundColor: '#fff',
|
|
- border: '1px solid #eaeaea',
|
|
- borderRadius: '12px',
|
|
- zIndex: 9999,
|
|
- display: 'flex',
|
|
- flexDirection: 'column',
|
|
- boxShadow: '0 10px 40px rgba(0,0,0,0.1)'
|
|
- }, children: [_jsx("div", { className: "chat-header", style: { padding: '16px', borderBottom: '1px solid #eaeaea', backgroundColor: '#f9f9f9', borderTopLeftRadius: '12px', borderTopRightRadius: '12px' }, children: _jsx("h3", { style: { margin: 0, fontSize: '16px' }, children: "Payload MCP Chat" }) }), _jsx("div", { className: "chat-messages", style: { flex: 1, padding: '16px', overflowY: 'auto' }, children: messages.map((m) => (_jsx("div", { style: {
|
|
- marginBottom: '12px',
|
|
- textAlign: m.role === 'user' ? 'right' : 'left'
|
|
- }, children: _jsxs("div", { style: {
|
|
- display: 'inline-block',
|
|
- padding: '8px 12px',
|
|
- borderRadius: '8px',
|
|
- backgroundColor: m.role === 'user' ? '#000' : '#f0f0f0',
|
|
- color: m.role === 'user' ? '#fff' : '#000',
|
|
- maxWidth: '80%'
|
|
- }, children: [m.role === 'user' ? 'G: ' : 'AI: ', m.content] }) }, m.id))) }), _jsx("form", { onSubmit: handleSubmit, style: { padding: '16px', borderTop: '1px solid #eaeaea' }, children: _jsx("input", { value: input, placeholder: "Ask me anything or use /commands...", onChange: handleInputChange, style: {
|
|
- width: '100%',
|
|
- padding: '12px',
|
|
- borderRadius: '8px',
|
|
- border: '1px solid #eaeaea',
|
|
- boxSizing: 'border-box'
|
|
- } }) })] }))] }));
|
|
+ return (_jsxs("div", {
|
|
+ className: "payload-mcp-chat-container", children: [_jsx("button", {
|
|
+ className: "payload-mcp-chat-toggle", onClick: () => setIsOpen(!isOpen), style: {
|
|
+ position: 'fixed',
|
|
+ bottom: '20px',
|
|
+ right: '20px',
|
|
+ zIndex: 9999,
|
|
+ padding: '12px 24px',
|
|
+ backgroundColor: '#000',
|
|
+ color: '#fff',
|
|
+ borderRadius: '8px',
|
|
+ border: 'none',
|
|
+ cursor: 'pointer',
|
|
+ fontWeight: 'bold'
|
|
+ }, children: isOpen ? 'Close AI Chat' : 'Ask AI'
|
|
+ }), isOpen && (_jsxs("div", {
|
|
+ className: "payload-mcp-chat-window", style: {
|
|
+ position: 'fixed',
|
|
+ bottom: '80px',
|
|
+ right: '20px',
|
|
+ width: '400px',
|
|
+ height: '600px',
|
|
+ backgroundColor: '#fff',
|
|
+ border: '1px solid #eaeaea',
|
|
+ borderRadius: '12px',
|
|
+ zIndex: 9999,
|
|
+ display: 'flex',
|
|
+ flexDirection: 'column',
|
|
+ boxShadow: '0 10px 40px rgba(0,0,0,0.1)'
|
|
+ }, children: [_jsx("div", { className: "chat-header", style: { padding: '16px', borderBottom: '1px solid #eaeaea', backgroundColor: '#f9f9f9', borderTopLeftRadius: '12px', borderTopRightRadius: '12px' }, children: _jsx("h3", { style: { margin: 0, fontSize: '16px' }, children: "Payload MCP Chat" }) }), _jsx("div", {
|
|
+ className: "chat-messages", style: { flex: 1, padding: '16px', overflowY: 'auto' }, children: messages.map((m) => (_jsx("div", {
|
|
+ style: {
|
|
+ marginBottom: '12px',
|
|
+ textAlign: m.role === 'user' ? 'right' : 'left'
|
|
+ }, children: _jsxs("div", {
|
|
+ style: {
|
|
+ display: 'inline-block',
|
|
+ padding: '8px 12px',
|
|
+ borderRadius: '8px',
|
|
+ backgroundColor: m.role === 'user' ? '#000' : '#f0f0f0',
|
|
+ color: m.role === 'user' ? '#fff' : '#000',
|
|
+ maxWidth: '80%'
|
|
+ }, children: [m.role === 'user' ? 'G: ' : 'AI: ', m.content]
|
|
+ })
|
|
+ }, m.id)))
|
|
+ }), _jsx("form", {
|
|
+ onSubmit: handleSubmit, style: { padding: '16px', borderTop: '1px solid #eaeaea' }, children: _jsx("input", {
|
|
+ value: input, placeholder: "Ask me anything or use /commands...", onChange: handleInputChange, style: {
|
|
+ width: '100%',
|
|
+ padding: '12px',
|
|
+ borderRadius: '8px',
|
|
+ border: '1px solid #eaeaea',
|
|
+ boxSizing: 'border-box'
|
|
+ }
|
|
+ })
|
|
+ })]
|
|
+ }))]
|
|
+ }));
|
|
};
|
|
//# sourceMappingURL=index.js.map
|
|
\ No newline at end of file
|
|
diff --git a/src/components/ChatWindow/index.tsx b/src/components/ChatWindow/index.tsx
|
|
index 9081ae77d4eae53ce660e285c1a6babde99ceaab..f262f1dd0fd1199734024cc27905d956e31900a2 100644
|
|
--- a/src/components/ChatWindow/index.tsx
|
|
+++ b/src/components/ChatWindow/index.tsx
|
|
@@ -2,7 +2,6 @@
|
|
|
|
import React, { useState } from 'react'
|
|
import { useChat } from '@ai-sdk/react'
|
|
-import './ChatWindow.scss'
|
|
|
|
export const ChatWindowProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
|
|
return (
|