Merge branch 'dev' into gradio4

modules/ui_extra_networks.py

@@ -134,8 +134,8 @@ def get_single_card(page: str = "", tabname: str = "", name: str = ""):
         errors.display(e, "creating item for extra network")
         item = page.items.get(name)
 
-    page.read_user_metadata(item)
-    item_html = page.create_item_html(tabname, item)
+    page.read_user_metadata(item, use_cache=False)
+    item_html = page.create_item_html(tabname, item, shared.html("extra-networks-card.html"))
 
     return JSONResponse({"html": item_html})
 
@@ -173,9 +173,9 @@ class ExtraNetworksPage:
     def refresh(self):
         pass
 
-    def read_user_metadata(self, item):
+    def read_user_metadata(self, item, use_cache=True):
         filename = item.get("filename", None)
-        metadata = extra_networks.get_user_metadata(filename, lister=self.lister)
+        metadata = extra_networks.get_user_metadata(filename, lister=self.lister if use_cache else None)
 
         desc = metadata.get("description", None)
         if desc is not None:
@@ -289,12 +289,16 @@ class ExtraNetworksPage:
                 }
             )
 
+        description = (item.get("description", "") or "" if shared.opts.extra_networks_card_show_desc else "")
+        if not shared.opts.extra_networks_card_description_is_html:
+            description = html.escape(description)
+
         # Some items here might not be used depending on HTML template used.
         args = {
             "background_image": background_image,
             "card_clicked": onclick,
             "copy_path_button": btn_copy_path,
-            "description": (item.get("description", "") or "" if shared.opts.extra_networks_card_show_desc else ""),
+            "description": description,
             "edit_button": btn_edit_item,
             "local_preview": quote_js(item["local_preview"]),
             "metadata_button": btn_metadata,
@@ -472,7 +476,7 @@ class ExtraNetworksPage:
 
         return f"<ul class='tree-list tree-list--tree'>{res}</ul>"
 
-    def create_card_view_html(self, tabname: str) -> str:
+    def create_card_view_html(self, tabname: str, *, none_message) -> str:
         """Generates HTML for the network Card View section for a tab.
 
         This HTML goes into the `extra-networks-pane.html` <div> with
@@ -480,6 +484,7 @@ class ExtraNetworksPage:
 
         Args:
             tabname: The name of the active tab.
+            none_message: HTML text to show when there are no cards.
 
         Returns:
             HTML formatted string.
@@ -490,24 +495,28 @@ class ExtraNetworksPage:
 
         if res == "":
             dirs = "".join([f"<li>{x}</li>" for x in self.allowed_directories_for_previews()])
-            res = shared.html("extra-networks-no-cards.html").format(dirs=dirs)
+            res = none_message or shared.html("extra-networks-no-cards.html").format(dirs=dirs)
 
         return res
 
-    def create_html(self, tabname):
+    def create_html(self, tabname, *, empty=False):
         """Generates an HTML string for the current pane.
 
         The generated HTML uses `extra-networks-pane.html` as a template.
 
         Args:
             tabname: The name of the active tab.
+            empty: create an empty HTML page with no items
 
         Returns:
             HTML formatted string.
         """
         self.lister.reset()
         self.metadata = {}
-        self.items = {x["name"]: x for x in self.list_items()}
+
+        items_list = [] if empty else self.list_items()
+        self.items = {x["name"]: x for x in items_list}
+
         # Populate the instance metadata for each item.
         for item in self.items.values():
             metadata = item.get("metadata")
@@ -522,9 +531,13 @@ class ExtraNetworksPage:
         data_sortkey = f"{data_sortmode}-{data_sortdir}-{len(self.items)}"
         tree_view_btn_extra_class = ""
         tree_view_div_extra_class = "hidden"
+        tree_view_div_default_display = "none"
+        extra_network_pane_content_default_display = "flex"
         if shared.opts.extra_networks_tree_view_default_enabled:
             tree_view_btn_extra_class = "extra-network-control--enabled"
             tree_view_div_extra_class = ""
+            tree_view_div_default_display = "block"
+            extra_network_pane_content_default_display = "grid"
 
         return self.pane_tpl.format(
             **{
@@ -536,7 +549,10 @@ class ExtraNetworksPage:
                 "tree_view_btn_extra_class": tree_view_btn_extra_class,
                 "tree_view_div_extra_class": tree_view_div_extra_class,
                 "tree_html": self.create_tree_view_html(tabname),
-                "items_html": self.create_card_view_html(tabname),
+                "items_html": self.create_card_view_html(tabname, none_message="Loading..." if empty else None),
+                "extra_networks_tree_view_default_width": shared.opts.extra_networks_tree_view_default_width,
+                "tree_view_div_default_display": tree_view_div_default_display,
+                "extra_network_pane_content_default_display": extra_network_pane_content_default_display,
             }
         )
 
@@ -559,7 +575,7 @@ class ExtraNetworksPage:
             "date_created": int(mtime),
             "date_modified": int(ctime),
             "name": pth.name.lower(),
-            "path": str(pth.parent).lower(),
+            "path": str(pth).lower(),
         }
 
     def find_preview(self, path):
@@ -638,6 +654,7 @@ def pages_in_preferred_order(pages):
 
     return sorted(pages, key=lambda x: tab_scores[x.name])
 
+
 def create_ui(interface: gr.Blocks, unrelated_tabs, tabname):
     ui = ExtraNetworksUi()
     ui.pages = []
@@ -648,15 +665,13 @@ def create_ui(interface: gr.Blocks, unrelated_tabs, tabname):
 
     related_tabs = []
 
-    button_refresh = gr.Button("Refresh", elem_id=f"{tabname}_extra_refresh_internal", visible=False)
-
     for page in ui.stored_extra_pages:
         with gr.Tab(page.title, elem_id=f"{tabname}_{page.extra_networks_tabname}", elem_classes=["extra-page"]) as tab:
             with gr.Column(elem_id=f"{tabname}_{page.extra_networks_tabname}_prompts", elem_classes=["extra-page-prompts"]):
                 pass
 
             elem_id = f"{tabname}_{page.extra_networks_tabname}_cards_html"
-            page_elem = gr.HTML('Loading...', elem_id=elem_id)
+            page_elem = gr.HTML(page.create_html(tabname, empty=True), elem_id=elem_id)
             ui.pages.append(page_elem)
 
             editor = page.create_user_metadata_editor(ui, tabname)
@@ -680,6 +695,15 @@ def create_ui(interface: gr.Blocks, unrelated_tabs, tabname):
         )
         tab.select(fn=None, _js=jscode, inputs=[], outputs=[], show_progress=False)
 
+        def refresh():
+            for pg in ui.stored_extra_pages:
+                pg.refresh()
+            create_html()
+            return ui.pages_contents
+
+        button_refresh = gr.Button("Refresh", elem_id=f"{tabname}_{page.extra_networks_tabname}_extra_refresh_internal", visible=False)
+        button_refresh.click(fn=refresh, inputs=[], outputs=ui.pages).then(fn=lambda: None, _js="function(){ " + f"applyExtraNetworkFilter('{tabname}_{page.extra_networks_tabname}');" + " }").then(fn=lambda: None, _js='setupAllResizeHandles')
+
     def create_html():
         ui.pages_contents = [pg.create_html(ui.tabname) for pg in ui.stored_extra_pages]
 
@@ -688,14 +712,7 @@ def create_ui(interface: gr.Blocks, unrelated_tabs, tabname):
             create_html()
         return ui.pages_contents
 
-    def refresh():
-        for pg in ui.stored_extra_pages:
-            pg.refresh()
-        create_html()
-        return ui.pages_contents
-
-    interface.load(fn=pages_html, inputs=[], outputs=[*ui.pages]).then(fn=None, js='function(){applyExtraNetworkFilter(' + quote_js(tabname) + '); return []}')
-    button_refresh.click(fn=refresh, inputs=[], outputs=ui.pages)
+    interface.load(fn=pages_html, inputs=[], outputs=ui.pages).then(fn=lambda: None, _js='setupAllResizeHandles')
 
     return ui