fixed translation text direction

app.py

@@ -17,6 +17,12 @@ def translate_text(text, direction):
     else:
         return translator_ar_to_en.translate(text)
 
+
+def update_output_alignment(direction): 
+    if direction == "English to Arabic": 
+        return gr.Textbox(label="Output Text", placeholder="النص المترجم سيظهر هنا...", lines=4, interactive=False, text_align="right")
+    else:
+        return gr.Textbox(label="Output Text", placeholder="The translated text will appear here...", lines=4, interactive=False, text_align="left")
 with gr.Blocks() as demo:
     gr.Markdown("# 🌍 Fanar Translation Demo")
     gr.Markdown("## Select the translation direction, enter your text, and get the translation !") 
@@ -28,11 +34,20 @@ with gr.Blocks() as demo:
         interactive=True,
     )
     
+    # I want to change the directionality of the output text depending on the direction selected
+    
     input_box = gr.Textbox(label="Input Text", placeholder="Enter text to translate here...", lines=4)
-    output_box = gr.Textbox(label="Output Text", placeholder="Translated text will appear here...", lines=4, interactive=False)
     
+    output_box = gr.Textbox(label="Output Text", placeholder="النص المترجم سيظهر هنا...", lines=4, interactive=False, text_align="right")
+
     translate_button = gr.Button("Translate")
     
+    
+    direction_dropdown.change(
+        fn = update_output_alignment,
+        inputs=direction_dropdown, 
+        outputs = output_box
+    )
     translate_button.click(
         fn=translate_text, 
         inputs=[input_box, direction_dropdown],