Update app.py
Browse files
app.py
CHANGED
@@ -444,54 +444,50 @@ def load_session_history(selected_session):
|
|
444 |
color: #666;
|
445 |
margin-top: 10px;
|
446 |
}
|
447 |
-
#code-display {
|
448 |
-
display: none;
|
449 |
-
}
|
450 |
</style>
|
451 |
<div class="prompt-grid">
|
452 |
"""
|
453 |
|
454 |
-
# 응답 데이터를 JavaScript 배열로 준비
|
455 |
-
responses_data = []
|
456 |
-
prompts_data = []
|
457 |
-
|
458 |
for i, (prompt, response, timestamp) in enumerate(history):
|
459 |
short_prompt = prompt[:100] + "..." if len(prompt) > 100 else prompt
|
460 |
formatted_time = datetime.strptime(timestamp, '%Y-%m-%d %H:%M:%S.%f').strftime('%Y-%m-%d %H:%M')
|
461 |
|
462 |
-
|
463 |
-
|
|
|
464 |
|
465 |
cards_html += f"""
|
466 |
-
<div class="prompt-card"
|
|
|
467 |
<div>{short_prompt}</div>
|
468 |
<div class="timestamp">{formatted_time}</div>
|
469 |
</div>
|
470 |
"""
|
471 |
|
472 |
-
cards_html += "
|
473 |
-
|
474 |
-
# JavaScript 함수 수정
|
475 |
-
cards_html += f"""
|
476 |
<script>
|
477 |
-
|
478 |
-
|
479 |
-
|
480 |
-
function executeHistoryItem(index) {{
|
481 |
-
// 입력 필드에 프롬프트 설정
|
482 |
-
document.querySelector('textarea').value = prompts[index];
|
483 |
|
484 |
// 코드 실행
|
485 |
-
const code =
|
|
|
|
|
|
|
486 |
const encodedHtml = btoa(code);
|
487 |
-
const dataUri = `data:text/html;charset=utf-8;base64,${
|
488 |
|
489 |
// iframe 업데이트
|
490 |
document.querySelector('.html_content iframe').src = dataUri;
|
491 |
|
492 |
// 세션 드로어 닫기
|
493 |
document.querySelector('.session-drawer').style.display = 'none';
|
494 |
-
|
|
|
|
|
|
|
495 |
</script>
|
496 |
"""
|
497 |
|
@@ -609,12 +605,11 @@ with gr.Blocks(css_paths="app.css",theme=theme) as demo:
|
|
609 |
outputs=[session_history]
|
610 |
)
|
611 |
|
612 |
-
#
|
613 |
-
|
614 |
-
|
615 |
-
|
616 |
-
|
617 |
-
)
|
618 |
|
619 |
|
620 |
# 메인 컨텐츠를 위한 Row
|
|
|
444 |
color: #666;
|
445 |
margin-top: 10px;
|
446 |
}
|
|
|
|
|
|
|
447 |
</style>
|
448 |
<div class="prompt-grid">
|
449 |
"""
|
450 |
|
|
|
|
|
|
|
|
|
451 |
for i, (prompt, response, timestamp) in enumerate(history):
|
452 |
short_prompt = prompt[:100] + "..." if len(prompt) > 100 else prompt
|
453 |
formatted_time = datetime.strptime(timestamp, '%Y-%m-%d %H:%M:%S.%f').strftime('%Y-%m-%d %H:%M')
|
454 |
|
455 |
+
# HTML 이스케이프 처리
|
456 |
+
escaped_prompt = html.escape(prompt)
|
457 |
+
escaped_response = html.escape(response)
|
458 |
|
459 |
cards_html += f"""
|
460 |
+
<div class="prompt-card"
|
461 |
+
onclick="executeHistoryItem(`{escaped_prompt}`, `{escaped_response}`)">
|
462 |
<div>{short_prompt}</div>
|
463 |
<div class="timestamp">{formatted_time}</div>
|
464 |
</div>
|
465 |
"""
|
466 |
|
467 |
+
cards_html += """
|
468 |
+
</div>
|
|
|
|
|
469 |
<script>
|
470 |
+
function executeHistoryItem(prompt, response) {
|
471 |
+
// 입력 필드 업데이트
|
472 |
+
document.querySelector('textarea').value = prompt;
|
|
|
|
|
|
|
473 |
|
474 |
// 코드 실행
|
475 |
+
const code = response.includes('```html') ?
|
476 |
+
response.match(/```html\\n([\\s\\S]*?)\\n```/)[1] :
|
477 |
+
response;
|
478 |
+
|
479 |
const encodedHtml = btoa(code);
|
480 |
+
const dataUri = `data:text/html;charset=utf-8;base64,${encodedHtml}`;
|
481 |
|
482 |
// iframe 업데이트
|
483 |
document.querySelector('.html_content iframe').src = dataUri;
|
484 |
|
485 |
// 세션 드로어 닫기
|
486 |
document.querySelector('.session-drawer').style.display = 'none';
|
487 |
+
|
488 |
+
// 렌더 탭으로 변경
|
489 |
+
document.querySelector('[data-testid="tab-render"]').click();
|
490 |
+
}
|
491 |
</script>
|
492 |
"""
|
493 |
|
|
|
605 |
outputs=[session_history]
|
606 |
)
|
607 |
|
608 |
+
# session_history.click(
|
609 |
+
# fn=execute_history_item,
|
610 |
+
# inputs=[],
|
611 |
+
# outputs=[input, sandbox, state_tab, session_drawer]
|
612 |
+
# )
|
|
|
613 |
|
614 |
|
615 |
# 메인 컨텐츠를 위한 Row
|