updating space to have autocomlete

app.py

@@ -5,6 +5,7 @@ from huggingface_hub import HfApi
 from huggingface_hub.errors import RepositoryNotFoundError
 import pandas as pd
 import plotly.express as px
+from gradio_huggingfacehub_search import HuggingfaceHubSearch
 
 HF_API = HfApi()
 
@@ -67,6 +68,7 @@ def get_repo_info(r_type, r_id):
             gr.Row(visible=False),
             gr.Dataframe(visible=False),
             gr.Plot(visible=False),
+            gr.Row(visible=False),
             gr.Dataframe(visible=False),
         )
     rf_sizes_df = (
@@ -77,6 +79,7 @@ def get_repo_info(r_type, r_id):
     # check if repo_sizes is just {}
     if not repo_sizes:
         r_sizes_component = gr.Dataframe(visible=False)
+        b_block = gr.Row(visible=False)
     else:
         r_sizes_df = pd.DataFrame(repo_sizes, index=["size"]).T.reset_index(
             names="branch"
@@ -86,6 +89,7 @@ def get_repo_info(r_type, r_id):
         r_sizes_component = gr.Dataframe(
             value=r_sizes_df[["Branch", "Size"]], visible=True
         )
+        b_block = gr.Row(visible=True)
 
     rf_sizes_df["formatted_size"] = rf_sizes_df["size"].apply(format_repo_size)
     rf_sizes_df.columns = ["Extension", "bytes", "Count", "Size"]
@@ -104,17 +108,25 @@ def get_repo_info(r_type, r_id):
             visible=True,
         ),
         gr.Plot(rf_sizes_plot, visible=True),
+        b_block,
         r_sizes_component,
     )
 
 
-with gr.Blocks(theme="citrus") as demo:
+with gr.Blocks(theme="ocean") as demo:
     gr.Markdown("# Repository Information")
     gr.Markdown(
         "Enter a repository ID and repository type and get back information about the repository's files and branches."
     )
     with gr.Blocks():
-        repo_id = gr.Textbox(label="Repository ID", placeholder="123456")
+        # repo_id = gr.Textbox(label="Repository ID", placeholder="123456")
+
+        repo_id = HuggingfaceHubSearch(
+            label="Hub Model ID",
+            placeholder="Search for model id on Huggingface",
+            search_type=["model", "dataset"],
+        )
+
         repo_type = gr.Radio(
             choices=["model", "dataset", "space"],
             label="Repository Type",
@@ -122,19 +134,21 @@ with gr.Blocks(theme="citrus") as demo:
         )
         search_button = gr.Button(value="Search")
     with gr.Blocks():
-        with gr.Row(visible=False) as results:
+        with gr.Row(visible=False) as results_block:
             with gr.Column():
                 gr.Markdown("## File Information")
                 with gr.Row():
                     file_info = gr.Dataframe(visible=False)
                     file_info_plot = gr.Plot(visible=False)
-                gr.Markdown("## Branch Sizes")
-                branch_sizes = gr.Dataframe(visible=False)
+                with gr.Row(visible=False) as branch_block:
+                    with gr.Column():
+                        gr.Markdown("## Branch Sizes")
+                        branch_sizes = gr.Dataframe(visible=False)
 
     search_button.click(
         get_repo_info,
         inputs=[repo_type, repo_id],
-        outputs=[results, file_info, file_info_plot, branch_sizes],
+        outputs=[results_block, file_info, file_info_plot, branch_block, branch_sizes],
     )
 
 demo.launch()

requirements.txt

@@ -1,10 +1,11 @@
 aiofiles==23.2.1 
 annotated-types==0.7.0 
 anyio==4.6.2.post1 
+audioop-lts==0.2.1
 certifi==2024.8.30 
 charset-normalizer==3.4.0 
 click==8.1.7  
-colorama==0.4.6
+colorama==0.4.6  
 fastapi==0.115.5 
 ffmpy==0.4.0 
 filelock==3.16.1 
@@ -52,3 +53,4 @@ tzdata==2024.2
 urllib3==2.2.3 
 uvicorn==0.32.0  
 websockets==12.0 
+gradio_huggingfacehub_search==0.0.7