|
import gradio as gr |
|
|
|
from app_utils import evaluate_prompt, get_split |
|
|
|
import logging |
|
|
|
logging.basicConfig(level=logging.INFO) |
|
|
|
|
|
with gr.Blocks(title=f"Prompting Challenge ({get_split()}") as demo: |
|
gr.Markdown( |
|
f""" |
|
# Prompting Challenge |
|
### ({get_split()}) |
|
""" + """ |
|
The goal of this challenge is to prompt GPT-4 to "unscramble" a sentence. |
|
|
|
The input is a sentence with scrambled word order, e.g.: *"are How ? you"* |
|
|
|
GPT-4 should identify the original sentence, e.g.: *"How are you?"* |
|
|
|
Enter your prompt template here. Use `{% shuffled_sentence %}` at the place where you want the shuffled sentence to be inserted. |
|
""" |
|
) |
|
|
|
input_text = gr.Textbox( |
|
lines=10, |
|
label="Prompt Template", |
|
value="Unscramble the following sentence: {% shuffled_sentence %}" |
|
) |
|
submit_button = gr.Button("Submit") |
|
results_output = gr.HTML(label="Results") |
|
|
|
def update_results(prompt): |
|
result_tuples = list(evaluate_prompt(prompt)) |
|
if result_tuples: |
|
total_score = sum(item_score for _, _, _, item_score in result_tuples) |
|
score = total_score / len(result_tuples) |
|
else: |
|
score = 0 |
|
html_output = "<dl style='font-family: Arial, sans-serif;'>" |
|
html_output += f"<h2 style='color: #333; margin-top: 20px; margin-bottom: 20px;'>Accuracy: {100 * score:.1f}%</h2>" |
|
newline = '\n' |
|
for index, (original, prompt, response, item_score) in enumerate(result_tuples, 1): |
|
background_color = "#fff4ea" if item_score < 0.5 else "#e4ffe4" if item_score > 0.9 else "whitesmoke" |
|
html_output += f""" |
|
<div style='background-color: {background_color}; padding: 10px; margin-bottom: 20px;'> |
|
<h3 style='color: #333; margin-top: 0;'>Test item #{index}</h3> |
|
<dt style='padding: 5px;'> |
|
<span style='font-weight: 600;'>Original Sentence:</span> |
|
</dt> |
|
<dd style='margin-left: 20px; padding: 5px;'>{original.replace(newline, "<br>")}</dd> |
|
|
|
<dt style='padding: 5px;'> |
|
<span style='font-weight: 600;'>Prompt:</span> |
|
</dt> |
|
<dd style='margin-left: 20px; padding: 5px;'>{prompt.replace(newline, "<br>")}</dd> |
|
|
|
<dt style='padding: 5px;'> |
|
<span style='font-weight: 600;'>Response by GPT-4:</span> |
|
</dt> |
|
<dd style='margin-left: 20px; padding: 5px;font-style: italic;'>{response.replace(newline, "<br>")}</dd> |
|
<dt style='padding: 5px;'> |
|
<span style='font-weight: 600;'>Score:</span> |
|
</dt> |
|
<dd style='margin-left: 20px; padding: 5px;'> |
|
<span style='color: #333;'>{100 * item_score:.1f}%</span> |
|
</dd> |
|
</div> |
|
""" |
|
html_output += "</dl>" |
|
return html_output |
|
|
|
submit_button.click( |
|
fn=update_results, |
|
inputs=[input_text], |
|
outputs=[results_output] |
|
) |
|
|
|
if __name__ == "__main__": |
|
demo.launch() |
|
|
|
|
