Added elements_id

ui/coding.py

@@ -6,7 +6,7 @@ from utils.ui import add_candidate_message, add_interviewer_message
 
 
 def get_problem_solving_ui(llm, tts, stt, default_audio_params, audio_output, name="Coding", interview_type="coding"):
-    with gr.Tab(name, render=False) as problem_tab:
+    with gr.Tab(name, render=False, elem_id=f"name_tab") as problem_tab:
         chat_history = gr.State([])
         previous_code = gr.State("")
         started_coding = gr.State(False)
@@ -23,6 +23,7 @@ def get_problem_solving_ui(llm, tts, stt, default_audio_params, audio_output, na
                             value="Medium",
                             container=False,
                             allow_custom_value=True,
+                            elem_id="difficulty_select",
                         )
                     with gr.Row():
                         topics = topic_lists[interview_type.value].copy()
@@ -34,13 +35,16 @@ def get_problem_solving_ui(llm, tts, stt, default_audio_params, audio_output, na
                             value=topics[0],
                             container=False,
                             allow_custom_value=True,
+                            elem_id="topic_select",
                         )
                 with gr.Column(scale=2):
-                    requirements = gr.Textbox(label="Requirements", placeholder="Specify additional requirements", lines=5)
-                    start_btn = gr.Button("Generate a problem")
+                    requirements = gr.Textbox(
+                        label="Requirements", placeholder="Specify additional requirements", lines=5, elem_id="requirements"
+                    )
+                    start_btn = gr.Button("Generate a problem", elem_id="start_btn")
 
         with gr.Accordion("Problem statement", open=True) as problem_acc:
-            description = gr.Markdown()
+            description = gr.Markdown(elem_id="problem_description")
         with gr.Accordion("Solution", open=False) as solution_acc:
             with gr.Row() as content:
                 with gr.Column(scale=2):
@@ -49,22 +53,25 @@ def get_problem_solving_ui(llm, tts, stt, default_audio_params, audio_output, na
                             label="Please write your code here. You can use any language, but only Python syntax highlighting is available.",
                             language="python",
                             lines=46,
+                            elem_id="code",
                         )
                     elif interview_type.value == "sql":
                         code = gr.Code(
                             label="Please write your query here.",
                             language="sql",
                             lines=46,
+                            elem_id="code",
                         )
                     else:
                         code = gr.Code(
                             label="Please write any notes for your solution here.",
                             language=None,
                             lines=46,
+                            elem_id="code",
                         )
                 with gr.Column(scale=1):
-                    end_btn = gr.Button("Finish the interview", interactive=False)
-                    chat = gr.Chatbot(label="Chat", show_label=False, show_share_button=False)
+                    end_btn = gr.Button("Finish the interview", interactive=False, variant="stop", elem_id="end_btn")
+                    chat = gr.Chatbot(label="Chat", show_label=False, show_share_button=False, elem_id="chat")
                     message = gr.Textbox(
                         label="Message",
                         show_label=False,
@@ -72,15 +79,16 @@ def get_problem_solving_ui(llm, tts, stt, default_audio_params, audio_output, na
                         max_lines=3,
                         interactive=True,
                         container=False,
+                        elem_id="message",
                     )
-                    send_btn = gr.Button("Send", interactive=False)
-                    audio_input = gr.Audio(interactive=False, **default_audio_params)
+                    send_btn = gr.Button("Send", interactive=False, elem_id="send_btn")
+                    audio_input = gr.Audio(interactive=False, **default_audio_params, elem_id="audio_input")
 
                     audio_buffer = gr.State(np.array([], dtype=np.int16))
                     transcript = gr.State({"words": [], "not_confirmed": 0, "last_cutoff": 0, "text": ""})
 
         with gr.Accordion("Feedback", open=True) as feedback_acc:
-            feedback = gr.Markdown()
+            feedback = gr.Markdown(elem_id="feedback")
 
         start_btn.click(fn=add_interviewer_message(fixed_messages["start"]), inputs=[chat], outputs=[chat]).success(
             fn=lambda: True, outputs=[started_coding]