Update app.py

app.py

@@ -94,41 +94,30 @@ def create_ui():
     formatted_spaces = format_spaces(spaces_list)
     print(f"Total spaces loaded: {len(formatted_spaces)}")  # 디버깅 출력
 
-    def create_table_html(spaces):
-        html = "<table><tr><th>Title</th><th>Author</th><th>Likes</th><th>Action</th></tr>"
-        for i, space in enumerate(spaces):
-            html += f"""
-            <tr>
-                <td>{space['name']}</td>
-                <td>{space['author']}</td>
-                <td>{space['likes']}</td>
-                <td><button onclick="selectSpace({i})">클릭</button></td>
-            </tr>
-            """
-        html += "</table>"
-        return html
-
     with gr.Blocks() as demo:
         gr.Markdown("# Hugging Face Most Liked Spaces")
         
         with gr.Row():
             with gr.Column(scale=1):
-                space_table = gr.HTML(create_table_html(formatted_spaces))
-                selected_index = gr.State(-1)
+                space_buttons = []
+                for space in formatted_spaces:
+                    with gr.Row():
+                        gr.Markdown(f"{space['name']} by {space['author']} (Likes: {space['likes']})")
+                        button = gr.Button("클릭", elem_id=f"btn-{space['id']}")
+                        space_buttons.append(button)
             
             with gr.Column(scale=1):
                 info_output = gr.Textbox(label="Space 정보 및 요약", lines=10)
                 app_py_content = gr.Code(language="python", label="app.py 내용")
 
-        def on_select(index):
+        def on_select(space):
             try:
-                selected_space = formatted_spaces[index]
-                summary = summarize_space(selected_space)
-                app_content = get_app_py_content(selected_space['id'])
-                info = f"선택된 Space: {selected_space['name']} (ID: {selected_space['id']})\n"
-                info += f"Author: {selected_space['author']}\n"
-                info += f"Likes: {selected_space['likes']}\n"
-                info += f"URL: {selected_space['url']}\n\n"
+                summary = summarize_space(space)
+                app_content = get_app_py_content(space['id'])
+                info = f"선택된 Space: {space['name']} (ID: {space['id']})\n"
+                info += f"Author: {space['author']}\n"
+                info += f"Likes: {space['likes']}\n"
+                info += f"URL: {space['url']}\n\n"
                 info += f"요약:\n{summary}"
                 return info, app_content
             except Exception as e:
@@ -136,18 +125,8 @@ def create_ui():
                 print(traceback.format_exc())
                 return f"오류가 발생했습니다: {str(e)}", ""
 
-        # JavaScript to handle button clicks
-        js_code = """
-        function selectSpace(index) {
-            document.querySelectorAll('button').forEach(btn => btn.classList.remove('selected'));
-            event.target.classList.add('selected');
-            selectedIndex.update(index);
-        }
-        """
-        demo.load(None, None, None)
-        gr.HTML(f"<script>{js_code}</script>")
-
-        selected_index.change(on_select, inputs=[selected_index], outputs=[info_output, app_py_content])
+        for button, space in zip(space_buttons, formatted_spaces):
+            button.click(on_select, inputs=[gr.State(space)], outputs=[info_output, app_py_content])
 
     return demo