Add error message

app.py

@@ -8,6 +8,7 @@ def enable_second_task(secret):
         return [
             gr.Textbox.update(visible=False),
             gr.Button.update(visible=False),
+            gr.HTML(visible=False),
             gr.Textbox.update(visible=True),
             gr.Textbox.update(visible=True),
             gr.Button.update(visible=True)                                                
@@ -15,6 +16,7 @@ def enable_second_task(secret):
     return [
         gr.Textbox.update(visible=True),
         gr.Button.update(visible=True),
+        gr.HTML.update(visible=True),
         gr.Textbox.update(visible=False),
         gr.Textbox.update(visible=False),
         gr.Button.update(visible=False)                                                
@@ -25,11 +27,17 @@ def greet(name):
 
 demo = gr.Blocks()
 with demo:
+    # Authentication
     secret_textbox = gr.Textbox(
         placeholder="Enter secret key", label="Secret", show_label=True
     )    
     secret_button = gr.Button("Submit")
-    
+    error_message = gr.HTML(
+        "<span style=\"text-color: red;\">Wrong secret key. Please retry</span>",
+        visible=False
+    )
+
+    # Demo logic
     name_textbox = gr.Textbox(
         placeholder="Name", label="Name", show_label=True, visible=False
     )
@@ -38,11 +46,11 @@ with demo:
     )    
     greet_button = gr.Button("Greet", visible=False)    
     
-    
     secret_button.click(
         enable_second_task,
         secret_textbox,
-        [secret_textbox, secret_button, name_textbox, greet_textbox, greet_button]
+        [secret_textbox, secret_button, error_message,
+         name_textbox, greet_textbox, greet_button]
     )
     greet_button.click(greet, name_textbox, greet_textbox)