Update app.py

app.py

@@ -13,6 +13,8 @@ def create_app():
         controls = create_filter_controls()
         filter_names = list(registry.filters.keys())
         
+        filter_groups = {} # Store filter groups
+        
         with gr.Row():
             with gr.Column():
                 input_image = gr.Image(label="Input Image", type="numpy")
@@ -23,9 +25,12 @@ def create_app():
                 )
                 
                 # Thêm các control vào UI
-                control_components = [c for c in controls.values()]
-                # for component in control_components:  # Removed render() calls
-                #     component.render()
+                control_components = []
+                for filter_name, control_list in controls.items():
+                    with gr.Group(visible=filter_name == "Original") as group: # Create group here
+                        filter_groups[filter_name] = group # Store group
+                        for component in control_list:
+                            control_components.append(component) # Collect sliders for event handling
             
             with gr.Column():
                 output_image = gr.Image(label="Filtered Image")
@@ -33,9 +38,9 @@ def create_app():
         # Xử lý cập nhật UI
         def update_controls(filter_name):
             updates = []
-            for filter_ctrl_name, ctrl_group in controls.items(): # controls now stores groups
-                visibility = True # Always make visible
-                updates.append(ctrl_group.update(visible=visibility)) # Update visibility of the group
+            for group_name, group in filter_groups.items():
+                visibility = (group_name == filter_name)
+                updates.append(gr.Group.update(visible=visibility, id_to_update=group)) # Update group visibility
             return updates
 
         # Xử lý ảnh real-time
@@ -69,12 +74,11 @@ def create_app():
         filter_select.change(
             update_controls,
             inputs=filter_select,
-            outputs=list(controls.values())
+            outputs=list(filter_groups.values())
         )
         
-        control_components_list = list(controls.values())
-        input_components_process = [input_image, filter_select] + control_components_list
-        for component in [input_image, filter_select] + control_components_list:
+        input_components_process = [input_image, filter_select] + control_components
+        for component in [input_image, filter_select] + control_components: # Attach change to sliders
             component.change(
                 process,
                 inputs=input_components_process,
@@ -86,4 +90,4 @@ def create_app():
 
 if __name__ == "__main__":
     app = create_app()
-    app.launch()
+    app.launch(show_error=True)