Add proper OAuth login button and profile handling

app.py

@@ -92,12 +92,13 @@ def create_gradio_interface():
         gr.Markdown("## Crowdsourcing Handwriting OCR Dataset")
         
         with gr.Row():
+            gr.LoginButton()
             user_info = gr.Markdown("")
 
-        def update_user_info(request: gr.Request):
-            if request.username:
-                return f"Logged in as: {request.username}", gr.update(visible=True)
-            return "Please log in with your Hugging Face account to contribute to the dataset.", gr.update(visible=False)
+        def update_user_info(profile: gr.OAuthProfile | None) -> str:
+            if profile:
+                return f"Logged in as: {profile.name}"
+            return "Please log in with your Hugging Face account to contribute to the dataset."
 
         with gr.Column(visible=False) as main_interface:
             gr.Markdown("You will be shown between 1 and 5 consecutive sentences. Please handwrite them on paper and upload an image of your handwriting. If you wish to skip the current text, click 'Skip'.")
@@ -109,30 +110,31 @@ def create_gradio_interface():
                 submit_btn = gr.Button("Submit")
                 skip_btn = gr.Button("Skip")
         
-        def check_login(request: gr.Request):
-            if request.username is None:
+        def check_login(profile: gr.OAuthProfile | None) -> str:
+            if profile is None:
                 raise gr.Error("Please log in to use this application")
-            return request.username
+            return profile.name
             
-        def protected_submit(image, text_block, request: gr.Request):
-            username = check_login(request)
+        def protected_submit(image, text_block, profile: gr.OAuthProfile | None):
+            username = check_login(profile)
             return collector.submit_image(image, text_block, username)
             
-        def protected_skip(text_block, request: gr.Request):
-            username = check_login(request)
+        def protected_skip(text_block, profile: gr.OAuthProfile | None):
+            username = check_login(profile)
             return collector.skip_text(text_block, username)
         
-        demo.load(update_user_info, outputs=[user_info, main_interface])
+        demo.load(update_user_info, inputs=gr.OAuthProfile(), outputs=[user_info])
+        demo.load(lambda p: gr.update(visible=p is not None), inputs=gr.OAuthProfile(), outputs=[main_interface])
         
         submit_btn.click(
             fn=protected_submit,
-            inputs=[image_input, text_box],
+            inputs=[image_input, text_box, gr.OAuthProfile()],
             outputs=text_box
         )
         
         skip_btn.click(
             fn=protected_skip,
-            inputs=[text_box],
+            inputs=[text_box, gr.OAuthProfile()],
             outputs=text_box
         )
     
@@ -140,4 +142,4 @@ def create_gradio_interface():
 
 if __name__ == "__main__":
     demo = create_gradio_interface()
-    demo.launch(auth_message="Please login with your Hugging Face account to contribute to the dataset.")
+    demo.launch()