4e6467ffb0
- Build complete Next.js CRM for commercial real estate - Add authentication with JWT sessions and role-based access - Add GoHighLevel API integration for contacts, conversations, opportunities - Add AI-powered Control Center with tool calling - Add Setup page with onboarding checklist (/setup) - Add sidebar navigation with Setup menu item - Fix type errors in onboarding API, GHL services, and control center tools - Add Prisma schema with SQLite for local development - Add UI components with clay morphism design system Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
43 lines
1.1 KiB
TypeScript
43 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import type { ControlCenterMessage } from '@/types/control-center';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
interface UserMessageBubbleProps {
|
|
message: ControlCenterMessage;
|
|
}
|
|
|
|
export const UserMessageBubble: React.FC<UserMessageBubbleProps> = ({
|
|
message,
|
|
}) => {
|
|
return (
|
|
<div className="flex justify-end">
|
|
<div className="max-w-[75%] space-y-1">
|
|
{/* Message Bubble */}
|
|
<div
|
|
className={cn(
|
|
'bg-indigo-600 text-white rounded-2xl rounded-tr-md px-4 py-3',
|
|
'shadow-[6px_6px_12px_rgba(79,70,229,0.25),-4px_-4px_8px_rgba(255,255,255,0.15)]',
|
|
'transition-all duration-300'
|
|
)}
|
|
>
|
|
<p className="text-sm leading-relaxed whitespace-pre-wrap">
|
|
{message.content}
|
|
</p>
|
|
</div>
|
|
|
|
{/* Timestamp */}
|
|
<div className="text-xs text-gray-400 text-right px-1">
|
|
{new Date(message.createdAt).toLocaleTimeString([], {
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
})}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default UserMessageBubble;
|