Update app.py

app.py

@@ -445,47 +445,80 @@ def load_session_history(selected_session):
         <div class="prompt-grid">
         """
 
+        # 히스토리 데이터를 JavaScript 객체로 변환
+        js_data = []
         for i, (prompt, response, timestamp) in enumerate(history):
             short_prompt = prompt[:100] + "..." if len(prompt) > 100 else prompt
             formatted_time = datetime.strptime(timestamp, '%Y-%m-%d %H:%M:%S.%f').strftime('%Y-%m-%d %H:%M')
             
+            js_data.append({
+                'prompt': prompt,
+                'response': response,
+                'short_prompt': short_prompt,
+                'timestamp': formatted_time
+            })
+            
             html_content += f"""
-            <div class="prompt-card" 
-                 data-prompt="{html.escape(prompt)}"
-                 data-response="{html.escape(response)}"
-                 onclick="gradioHandleClick(this)">
+            <div class="prompt-card" onclick="cardClicked({i})">
                 <div>{html.escape(short_prompt)}</div>
                 <div class="timestamp">{formatted_time}</div>
             </div>
             """
 
-        html_content += """
+        html_content += f"""
         </div>
         <script>
-        function gradioHandleClick(element) {
-            const data = {
-                prompt: element.getAttribute('data-prompt'),
-                response: element.getAttribute('data-response')
-            };
-            // Gradio의 select 이벤트 트리거
-            document.querySelector('.session-history').dispatchEvent(
-                new CustomEvent('select', { 
-                    detail: { 
-                        value: data, 
-                        index: 0,
-                        target: element
-                    } 
-                })
+        const historyData = {json.dumps(js_data)};
+        
+        function cardClicked(index) {{
+            const item = historyData[index];
+            
+            // 텍스트 영역 업데이트
+            const textarea = document.querySelector('textarea');
+            if (textarea) {{
+                textarea.value = item.prompt;
+            }}
+            
+            // 코드 추출 및 실행
+            let code = item.response;
+            if (code.includes('```html')) {{
+                const match = code.match(/```html\\n([\\s\\S]*?)\\n```/);
+                if (match) {{
+                    code = match[1];
+                }}
+            }}
+            
+            // iframe 업데이트
+            const encodedHtml = btoa(unescape(encodeURIComponent(code.trim())));
+            const dataUri = `data:text/html;charset=utf-8;base64,${{encodedHtml}}`;
+            
+            const iframe = document.querySelector('.html_content iframe');
+            if (iframe) {{
+                iframe.src = dataUri;
+            }}
+            
+            // 실행 버튼 클릭
+            const executeButton = Array.from(document.querySelectorAll('button')).find(
+                button => button.textContent.includes('Code 실행')
             );
-        }
+            if (executeButton) {{
+                executeButton.click();
+            }}
+            
+            // 드로어 닫기
+            const drawer = document.querySelector('.session-drawer');
+            if (drawer) {{
+                drawer.style.display = 'none';
+            }}
+        }}
         </script>
         """
         
-        return gr.HTML(value=html_content, interactive=True)
+        return gr.HTML(value=html_content)
         
     except Exception as e:
         print(f"Error loading session history: {e}")
-        return gr.HTML("Error loading history", interactive=True)
+        return gr.HTML("Error loading history")
 
 # 히스토리 아이템 선택 처리 함수
 def handle_history_selection(evt: gr.SelectData):