Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-24 20:30:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: update to latest, use update time for ordering

Browse source
This commit is contained in:
Danny Avila 2024-08-23 20:12:22 -04:00
parent 8ce70a41b7
commit 4c810fa5db
3 changed files with 21 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/src/common/artifacts.ts
View file

@ -6,7 +6,7 @@ export interface CodeBlock {
export interface Artifact {
id: string;
order: number;
lastUpdateTime: number;
identifier?: string;
language?: string;
content?: string;

18
client/src/components/Artifacts/Artifact.tsx
View file

@ -6,6 +6,7 @@ import type { Pluggable } from 'unified';
import type { Artifact } from '~/common';
import { artifactsState, artifactIdsState } from '~/store/artifacts';
import CodePreview from './CodePreview';
import { logger } from '~/utils';
export const artifactPlugin: Pluggable = () => {
return (tree) => {
@ -56,6 +57,7 @@ export function Artifact({
const updateArtifact = useCallback(() => {
const content = extractContent(props.children);
logger.log('artifacts', 'updateArtifact: content.length', content.length);
if (!content || content.trim() === '') {
return;
@ -67,9 +69,7 @@ export function Artifact({
const artifactKey = `${identifier}_${type}_${title}`.replace(/\s+/g, '_').toLowerCase();
throttledUpdateRef.current(() => {
const existingArtifact = currentArtifacts[artifactKey];
const order =
existingArtifact != null ? existingArtifact.order : Object.keys(currentArtifacts).length;
const now = Date.now();
const currentArtifact: Artifact = {
id: artifactKey,
@ -77,15 +77,11 @@ export function Artifact({
title,
type,
content,
order,
lastUpdateTime: now,
};
setArtifacts((prevArtifacts) => {
if (
prevArtifacts[artifactKey] != null &&
prevArtifacts[artifactKey].content === content &&
prevArtifacts[artifactKey].order === order
) {
if (prevArtifacts[artifactKey] != null && prevArtifacts[artifactKey].content === content) {
return prevArtifacts;
}
@ -99,7 +95,9 @@ export function Artifact({
if (!prevIds.includes(artifactKey)) {
const newIds = [...prevIds, artifactKey];
const definedIds = newIds.filter((id) => currentArtifacts[id] != null);
return definedIds.sort((a, b) => currentArtifacts[a].order - currentArtifacts[b].order);
return definedIds.sort(
(a, b) => currentArtifacts[b].lastUpdateTime - currentArtifacts[a].lastUpdateTime,
);
}
return prevIds;
});

22
client/src/components/Artifacts/Artifacts.tsx
View file

@ -69,7 +69,9 @@ export default function Artifacts() {
const [currentArtifactId, setCurrentArtifactId] = useState<string | null>(null);
const orderedArtifactIds = useMemo(() => {
return Object.keys(artifacts).sort((a, b) => artifacts[a].order - artifacts[b].order);
return Object.keys(artifacts).sort(
(a, b) => artifacts[a].lastUpdateTime - artifacts[b].lastUpdateTime,
);
}, [artifacts]);
const lastRunMessageIdRef = useRef<string | null>(null);
@ -79,6 +81,14 @@ export default function Artifacts() {
setIsVisible(true);
}, []);
useEffect(() => {
if (orderedArtifactIds.length > 0) {
const latestArtifactId = orderedArtifactIds[orderedArtifactIds.length - 1];
setCurrentArtifactId(latestArtifactId);
setActiveTab('code');
}
}, [orderedArtifactIds]);
useEffect(() => {
if (latestMessage?.messageId !== lastRunMessageIdRef.current) {
const currentArtifact = currentArtifactId != null ? artifacts[currentArtifactId] : null;
@ -92,19 +102,11 @@ export default function Artifacts() {
) {
setActiveTab('code');
lastContentRef.current = currentContent;
} else if (!isSubmitting && currentArtifactId == null && orderedArtifactIds.length > 0) {
setCurrentArtifactId(orderedArtifactIds[0]);
}
lastRunMessageIdRef.current = latestMessage?.messageId ?? null;
}
}, [activeTab, currentArtifactId, isSubmitting, latestMessage, orderedArtifactIds, artifacts]);
useEffect(() => {
if (orderedArtifactIds.length > 0 && !(currentArtifactId ?? '')) {
setCurrentArtifactId(orderedArtifactIds[orderedArtifactIds.length - 1]);
}
}, [orderedArtifactIds, currentArtifactId]);
}, [activeTab, currentArtifactId, isSubmitting, latestMessage, artifacts]);
const currentArtifact = currentArtifactId != null ? artifacts[currentArtifactId] : null;