fix: update modified files handling in Chat.client.tsx

This commit is contained in:
Hayat Bourgi 2025-04-17 12:24:07 +03:00 committed by Stijnus
parent dac37b4344
commit 2c635d5df2
2 changed files with 43 additions and 15 deletions

View File

@ -422,8 +422,16 @@ export const ChatImpl = memo(
chatStore.setKey('aborted', false);
if (modifiedFiles !== undefined) {
const userUpdateArtifact = filesToArtifacts(modifiedFiles, `${Date.now()}`);
if (modifiedFiles) {
// Convert the modifiedFiles object to an array of [filePath, file] entries
const modifiedFilesWithContent = Object.entries(modifiedFiles).reduce<Record<string, { content: string }>>((acc, [filePath, file]) => {
if (file?.type === 'file') {
acc[filePath] = { content: file.content };
}
return acc;
}, {});
const userUpdateArtifact = filesToArtifacts(modifiedFilesWithContent, `${Date.now()}`);
append({
role: 'user',
content: [

View File

@ -1,4 +1,4 @@
import { memo, useCallback, useEffect, useRef, useState } from 'react';
import { memo, useCallback, useEffect, useRef, useState, useMemo } from 'react';
import { useStore } from '@nanostores/react';
import { IconButton } from '~/components/ui/IconButton';
import { workbenchStore } from '~/lib/stores/workbench';
@ -6,6 +6,7 @@ import { PortDropdown } from './PortDropdown';
import { ScreenshotSelector } from './ScreenshotSelector';
import { expoUrlAtom } from '~/lib/stores/qrCodeStore';
import { ExpoQrModal } from '~/components/workbench/ExpoQrModal';
import type { PreviewInfo } from '~/lib/stores/previews';
type ResizeSide = 'left' | 'right' | null;
@ -56,16 +57,33 @@ export const Preview = memo(() => {
const [isPortDropdownOpen, setIsPortDropdownOpen] = useState(false);
const [isFullscreen, setIsFullscreen] = useState(false);
const hasSelectedPreview = useRef(false);
const previews = useStore(workbenchStore.previews);
const rawPreviews = useStore(workbenchStore.previews);
const previews = useMemo(() => {
if (rawPreviews && typeof rawPreviews === 'object' && !Array.isArray(rawPreviews)) {
return Object.values(rawPreviews)
.map((v) => v as unknown)
.filter(
(v): v is PreviewInfo =>
typeof v === 'object' &&
v !== null &&
typeof (v as any).port === 'number' &&
typeof (v as any).ready === 'boolean' &&
typeof (v as any).baseUrl === 'string',
);
}
return [];
}, [rawPreviews]);
const activePreview = previews[activePreviewIndex];
const [displayPath, setDisplayPath] = useState('/');
const [iframeUrl, setIframeUrl] = useState<string | undefined>();
const [isSelectionMode, setIsSelectionMode] = useState(false);
// Toggle between responsive mode and device mode
const [isDeviceModeOn, setIsDeviceModeOn] = useState(false);
// Use percentage for width
const [widthPercent, setWidthPercent] = useState<number>(37.5);
const [currentWidth, setCurrentWidth] = useState<number>(0);
@ -78,7 +96,6 @@ export const Preview = memo(() => {
pointerId: null as number | null,
});
// Reduce scaling factor to make resizing less sensitive
const SCALING_FACTOR = 1;
const [isWindowSizeDropdownOpen, setIsWindowSizeDropdownOpen] = useState(false);
@ -103,8 +120,11 @@ export const Preview = memo(() => {
}, [activePreview]);
const findMinPortIndex = useCallback(
(minIndex: number, preview: { port: number }, index: number, array: { port: number }[]) => {
return preview.port < array[minIndex].port ? index : minIndex;
(minIndex: number, preview: PreviewInfo, index: number, array: PreviewInfo[]) => {
const currentPort = typeof preview.port === 'string' ? parseInt(preview.port, 10) : preview.port;
const minPort = typeof array[minIndex].port === 'string' ? parseInt(array[minIndex].port, 10) : array[minIndex].port;
return currentPort < minPort ? index : minIndex;
},
[],
);