Automatically refresh app iframe

src/hooks/useRunApp.ts

@@ -106,5 +106,10 @@ export function useRunApp() {
     }
   }, []);
 
-  return { loading, error, runApp, stopApp, restartApp, app };
+  const refreshAppIframe = useCallback(async () => {
+    setPreviewPanelKey((prevKey) => prevKey + 1);
+    setError(null);
+  }, [setPreviewPanelKey, setError]);
+
+  return { loading, error, runApp, stopApp, restartApp, app, refreshAppIframe };
 }

src/hooks/useStreamChat.ts

@@ -17,6 +17,7 @@ import { useLoadVersions } from "./useLoadVersions";
 import { showError } from "@/lib/toast";
 import { useProposal } from "./useProposal";
 import { useSearch } from "@tanstack/react-router";
+import { useRunApp } from "./useRunApp";
 
 export function getRandomString() {
   return Math.random().toString(36).substring(2, 15);
@@ -34,6 +35,7 @@ export function useStreamChat({
   const { refreshApp } = useLoadApp(selectedAppId);
   const setStreamCount = useSetAtom(chatStreamCountAtom);
   const { refreshVersions } = useLoadVersions(selectedAppId);
+  const { refreshAppIframe } = useRunApp();
   let chatId: number | undefined;
 
   if (hasChatId) {
@@ -100,6 +102,7 @@ export function useStreamChat({
           onEnd: (response: ChatResponseEnd) => {
             if (response.updatedFiles) {
               setIsPreviewOpen(true);
+              refreshAppIframe();
             }
             refreshProposal(chatId);