Update app-backup1.py

app-backup1.py

@@ -11,6 +11,12 @@ import modelscope_studio.components.legacy as legacy
 import modelscope_studio.components.antd as antd
 from config import DEMO_LIST, SystemPrompt
 
+# 파일 상단의 import 문 아래에 추가
+def get_image_base64(image_path):
+    with open(image_path, "rb") as image_file:
+        encoded_string = base64.b64encode(image_file.read()).decode()
+    return encoded_string
+    
 YOUR_API_TOKEN = os.getenv('ANTHROPIC_API_KEY')
 client = anthropic.Anthropic(api_key=YOUR_API_TOKEN)
 
@@ -59,6 +65,8 @@ def demo_card_click(e: gr.EventData):
     index = e._data['component']['index']
     return DEMO_LIST[index]['description']
 
+
+
 with gr.Blocks(css_paths="app.css") as demo:
     history = gr.State([])
     setting = gr.State({
@@ -70,12 +78,14 @@ with gr.Blocks(css_paths="app.css") as demo:
             with antd.Row(gutter=[32, 12]) as layout:
                 with antd.Col(span=24, md=8):
                     with antd.Flex(vertical=True, gap="middle", wrap=True):
-                        header = gr.HTML("""
-                                  <div class="left_header">
-                                   <img src="//img.alicdn.com/imgextra/i2/O1CN01KDhOma1DUo8oa7OIU_!!6000000000220-1-tps-240-240.gif" width="200px" />
-                                   <h1>Claude-3-Sonnet Coder</h2>
-                                  </div>
-                                   """)
+                        # 수정된 header 부분
+                        header = gr.HTML(f"""
+                                    <div class="left_header">
+                                     <img src="data:image/gif;base64,{get_image_base64('mouse.gif')}" width="200px" />
+                                     <h1>MOUSE Coder: WEB</h2>
+                                    </div>
+                                     """)
+ 
                         input = antd.InputTextarea(
                             size="large", allow_clear=True, placeholder="Please enter what kind of application you want")
                         btn = antd.Button("send", type="primary", size="large")
@@ -157,29 +167,42 @@ with gr.Blocks(css_paths="app.css") as demo:
                         gr.update(open=True)   # code_drawer
                     ]
 
-                    response = client.messages.create(
+                    # 스트리밍 응답 사용
+                    with client.messages.stream(
                         model="claude-3-5-sonnet-20241022",
                         max_tokens=7800,
                         system=system_message,
                         messages=claude_messages
-                    )
-                    
-                    content = response.content[0].text
-                    _history = messages_to_history([
-                        {'role': Role.SYSTEM, 'content': system_message}
-                    ] + claude_messages + [{
-                        'role': Role.ASSISTANT,
-                        'content': content
-                    }])
-                    
-                    # 최종 결과 반환
-                    yield [
-                        content,              # code_output
-                        _history,            # history
-                        send_to_sandbox(remove_code_block(content)),  # sandbox
-                        gr.update(active_key="render"),  # state_tab
-                        gr.update(open=True)  # code_drawer
-                    ]
+                    ) as stream:
+                        collected_content = ""
+                        for chunk in stream:
+                            if chunk.type == "content_block_delta":
+                                delta = chunk.delta.text
+                                collected_content += delta
+                                
+                                yield [
+                                    collected_content,  # code_output
+                                    _history,          # history
+                                    None,              # sandbox (아직 완성되지 않았으므로 None)
+                                    gr.update(active_key="loading"),  # state_tab
+                                    gr.update(open=True)  # code_drawer
+                                ]
+                        
+                        # 최종 결과 반환
+                        _history = messages_to_history([
+                            {'role': Role.SYSTEM, 'content': system_message}
+                        ] + claude_messages + [{
+                            'role': Role.ASSISTANT,
+                            'content': collected_content
+                        }])
+                        
+                        yield [
+                            collected_content,  # code_output
+                            _history,          # history
+                            send_to_sandbox(remove_code_block(collected_content)),  # sandbox
+                            gr.update(active_key="render"),  # state_tab
+                            gr.update(open=True)  # code_drawer
+                        ]
                     
                 except Exception as e:
                     raise ValueError(f'Error calling Claude API: {str(e)}')