Update app.py

app.py

@@ -90,17 +90,19 @@ def gradio_app():
         rom_files = list_roms()
 
         # Display the available ROM files
-        if rom_files:
-            for rom_name in rom_files:
-                # Create a button for each ROM
-                gr.Button(rom_name).click(generate_rom_page, inputs=gr.State(rom_name), outputs=gr.HTML())
-
-        # Display the ROM page inside a container with custom styling
         with gr.Column():
+            rom_buttons = gr.Dropdown(choices=rom_files, label="Select a ROM to Play", interactive=True)
+
             output_html = gr.HTML(value="Please select a ROM to play.")
             
-            # Apply the style using inline HTML
-            output_html.value = '<div style="width: 100%; height: 500px; overflow: hidden;">' + output_html.value + '</div>'
+            # When a ROM is selected from the dropdown, update the HTML display with the ROM content
+            rom_buttons.change(fn=generate_rom_page, inputs=rom_buttons, outputs=output_html)
+
+            # Style for scrollable ROM list
+            rom_buttons.style(width="100%", height="300px", overflow="auto")
+
+            # Applying container style (for the video section)
+            output_html.style(width="100%", height=500)
 
     app.launch(server_name="0.0.0.0", server_port=7860, share=True)
 
@@ -115,3 +117,4 @@ gradio_app()
 
 
 
+