Update src/demo/app.py

src/demo/app.py

@@ -1,62 +1,62 @@
-import gradio as gr
-from gradio_folderexplorer import FolderExplorer
-from gradio_folderexplorer.helpers import load_media_from_folder
-from PIL import Image
-import os
-
-# --- Configuration Constants ---
-
-# Define the root directory for the FolderExplorer to start in.
-# All browsable folders will be relative to this path.
-ROOT_DIR_PATH = "./examples"
-
-# --- UI Layout and Logic ---
-
-# Create the user interface using Gradio Blocks.
-with gr.Blocks(theme=gr.themes.Ocean()) as demo:
-    # A single row is used to create a side-by-side layout.
-    gr.Markdown("# FolderExplorer Component Demo")
-    with gr.Row(equal_height=True):
-        # The first column contains the custom folder explorer component.
-        with gr.Column(scale=1, min_width=300):
-            folder_explorer = FolderExplorer(
-                label="Select a Folder",
-                root_dir=ROOT_DIR_PATH,
-                # Set the initial selected value to the root directory itself.
-                # This is used by the demo.load() event.
-                value=ROOT_DIR_PATH
-            )
-        
-        # The second column contains the gallery to display the media.
-        with gr.Column(scale=3):
-            gallery = gr.Gallery(
-                label="Selected Images",
-                columns=6,
-                height="auto",
-            )
-
-    # --- Event Handling ---
-
-    # 1. Event for user interaction:
-    # When the user selects a new folder in the FolderExplorer, the .change() event
-    # is triggered. The `load_media_from_folder` helper is called with the new
-    # folder path, and its output populates the gallery.
-    folder_explorer.change(
-        fn=load_media_from_folder,
-        inputs=folder_explorer,
-        outputs=gallery
-    )
-    
-    # 2. Event for initial page load:
-    # This event runs once when the app starts. It takes the initial `value` of the
-    # folder_explorer ('ROOT_DIR_PATH'), passes it to the helper function,
-    # and populates the gallery with the media from the root directory.
-    demo.load(
-        fn=load_media_from_folder,
-        inputs=folder_explorer,
-        outputs=gallery
-    )
-
-# --- Application Launch ---
-if __name__ == "__main__":
+import gradio as gr
+from gradio_folderexplorer import FolderExplorer
+from gradio_folderexplorer.helpers import load_media_from_folder
+from PIL import Image
+import os
+
+# --- Configuration Constants ---
+
+# Define the root directory for the FolderExplorer to start in.
+# All browsable folders will be relative to this path.
+ROOT_DIR_PATH = "./src/examples"
+
+# --- UI Layout and Logic ---
+
+# Create the user interface using Gradio Blocks.
+with gr.Blocks(theme=gr.themes.Ocean()) as demo:
+    # A single row is used to create a side-by-side layout.
+    gr.Markdown("# FolderExplorer Component Demo")
+    with gr.Row(equal_height=True):
+        # The first column contains the custom folder explorer component.
+        with gr.Column(scale=1, min_width=300):
+            folder_explorer = FolderExplorer(
+                label="Select a Folder",
+                root_dir=ROOT_DIR_PATH,
+                # Set the initial selected value to the root directory itself.
+                # This is used by the demo.load() event.
+                value=ROOT_DIR_PATH
+            )
+        
+        # The second column contains the gallery to display the media.
+        with gr.Column(scale=3):
+            gallery = gr.Gallery(
+                label="Selected Images",
+                columns=6,
+                height="auto",
+            )
+
+    # --- Event Handling ---
+
+    # 1. Event for user interaction:
+    # When the user selects a new folder in the FolderExplorer, the .change() event
+    # is triggered. The `load_media_from_folder` helper is called with the new
+    # folder path, and its output populates the gallery.
+    folder_explorer.change(
+        fn=load_media_from_folder,
+        inputs=folder_explorer,
+        outputs=gallery
+    )
+    
+    # 2. Event for initial page load:
+    # This event runs once when the app starts. It takes the initial `value` of the
+    # folder_explorer ('ROOT_DIR_PATH'), passes it to the helper function,
+    # and populates the gallery with the media from the root directory.
+    demo.load(
+        fn=load_media_from_folder,
+        inputs=folder_explorer,
+        outputs=gallery
+    )
+
+# --- Application Launch ---
+if __name__ == "__main__":
     demo.launch()