switch to using gr.LoginButton and update UI accordingly

README.md

@@ -9,6 +9,9 @@ app_file: app.py
 pinned: false
 license: mit
 short_description: 'Build support agent with CrewAI multi-agents and Gradio '
+hf_oauth: true
+hf_oauth_scopes:
+  - read-repos
 ---
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -246,19 +246,12 @@ def create_demo():
         gr.Markdown(
             "This is a friendly, high-performing multi-agent application built with Gradio and CrewAI. Enter a webpage URL and your questions from that webpage."
         )
-        HF_api_key = gr.Textbox(
-            label="HuggingFace API Key",
-            type="password",
-            placeholder="Type your OpenAI API Key and press Enter to access the app...",
-            interactive=True,
-        )
 
         chatbot = gr.Chatbot(
             label="Support Process",
             height=700,
             type="messages",
             show_label=True,
-            visible=False,
             avatar_images=(
                 None,
                 "https://avatars.githubusercontent.com/u/170677839?v=4",
@@ -271,24 +264,25 @@ def create_demo():
                 label="Your Inquiry",
                 placeholder="Enter your question...",
                 scale=4,
-                visible=False,
             )
             website_url = gr.Textbox(
                 label="Documentation URL",
                 placeholder="Enter documentation URL to search...",
                 scale=4,
-                visible=False,
             )
-            btn = gr.Button("Get Support", variant="primary", scale=1, visible=False)
+            btn = gr.Button("Get Support", variant="primary", scale=1)
 
-        async def process_input(inquiry_text, website_url_text, history, api_key):
+        async def process_input(
+            inquiry_text, website_url_text, history, oauth_token: gr.OAuthToken | None
+        ):
             nonlocal support_crew
+            api_key = oauth_token.token
             if not api_key:
                 history = history or []
                 history.append(
                     {
                         "role": "assistant",
-                        "content": "Please provide an OpenAI API key.",
+                        "content": "Please provide huggingface key.",
                         "metadata": {"title": "❌ Error"},
                     }
                 )
@@ -323,27 +317,31 @@ def create_demo():
                 )
                 yield history
 
-        def show_interface():
-            return {
-                HF_api_key: gr.Textbox(visible=False),
-                chatbot: gr.Chatbot(visible=True),
-                inquiry: gr.Textbox(visible=True),
-                website_url: gr.Textbox(visible=True),
-                btn: gr.Button(visible=True),
-            }
-
-        HF_api_key.submit(
-            show_interface, None, [HF_api_key, chatbot, inquiry, website_url, btn]
-        )
-        btn.click(process_input, [inquiry, website_url, chatbot, HF_api_key], [chatbot])
-        inquiry.submit(
-            process_input, [inquiry, website_url, chatbot, HF_api_key], [chatbot]
-        )
+        btn.click(process_input, [inquiry, website_url, chatbot], [chatbot])
+        inquiry.submit(process_input, [inquiry, website_url, chatbot], [chatbot])
 
     return demo
 
 
+def swap_visibilty(profile: gr.OAuthProfile | None):
+    return (
+        gr.update(elem_classes=["main_ui_logged_in"])
+        if profile
+        else gr.update(elem_classes=["main_ui_logged_out"])
+    )
+
+
+css = """
+.main_ui_logged_out{opacity: 0.3; pointer-events: none}
+"""
+
+interface = create_demo()
+with gr.Blocks(css=css) as demo:
+    gr.LoginButton()
+    with gr.Column(elem_classes="main_ui_logged_out") as main_ui:
+        interface.render()
+    demo.load(fn=swap_visibilty, outputs=main_ui)
+
 if __name__ == "__main__":
-    demo = create_demo()
     demo.queue()
-    demo.launch(debug=True)
+    demo.launch()