37 lines
1.4 KiB
TypeScript
37 lines
1.4 KiB
TypeScript
import type { FileUIPart } from 'ai';
|
|
import type { UPageUIMessage } from '~/types/message';
|
|
import { MODEL_REGEX, PROVIDER_REGEX } from '~/utils/constants';
|
|
import { ElementEditPreview } from './ElementEditPreview';
|
|
import { Markdown } from './Markdown';
|
|
|
|
export function UserMessage({ message }: { message: UPageUIMessage }) {
|
|
const parts = message.parts;
|
|
const textContent = stripMetadata(parts.find((part) => part.type === 'text')?.text || '');
|
|
const images = parts.filter((part) => part.type === 'file' && part.mediaType.startsWith('image')) as FileUIPart[];
|
|
const elementInfo = message.metadata?.elementInfo;
|
|
|
|
return (
|
|
<div className="overflow-hidden pt-2">
|
|
<div className="flex flex-col gap-3">
|
|
{textContent && <Markdown html>{textContent}</Markdown>}
|
|
{images.map((item, index) => (
|
|
<img
|
|
key={index}
|
|
src={item.url}
|
|
alt={item.filename || `Image ${index + 1}`}
|
|
className="max-w-full h-auto rounded-lg"
|
|
style={{ maxHeight: '512px', objectFit: 'contain' }}
|
|
/>
|
|
))}
|
|
|
|
{elementInfo && <ElementEditPreview elementEditInfo={elementInfo} className="mt-3" />}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function stripMetadata(content: string) {
|
|
const artifactRegex = /<uPageArtifact\s+[^>]*>[\s\S]*?<\/uPageArtifact>/gm;
|
|
return content.replace(MODEL_REGEX, '').replace(PROVIDER_REGEX, '').replace(artifactRegex, '');
|
|
}
|