Create app.py

app.py

@@ -0,0 +1,90 @@
+import gradio as gr
+from openai import OpenAI
+import os
+
+client = OpenAI(api_key=os.getenv("OPENAI_API_KEY"))
+
+# ---- GPT-5 explanation backend ----
+def explain_text(selected_text):
+    if not selected_text.strip():
+        return "Highlight some text first 👆"
+
+    prompt = f"""
+You are an expert machine learning instructor.
+
+The user highlighted the following text from a learning resource:
+
+\"\"\"
+{selected_text}
+\"\"\"
+
+Explain it clearly and intuitively.
+Assume the reader has basic ML knowledge.
+Keep it concise and educational.
+"""
+
+    response = client.responses.create(
+        model="gpt-5",
+        input=prompt,
+    )
+
+    return response.output_text
+
+
+# ---- Page content (replace later with markdown file) ----
+PAGE_HTML = """
+<div id="content" style="max-width: 800px; margin: auto; font-size: 16px; line-height: 1.6;">
+<h1>Text Generation</h1>
+
+<p>
+Text generation is the task of producing natural language text given an input prompt.
+It is commonly used for chatbots, creative writing, summarization, and code generation.
+</p>
+
+<p>
+Most modern text generation models are based on the transformer architecture
+and are trained using next-token prediction.
+</p>
+
+<p>
+During inference, the model repeatedly samples the most likely next token
+until a stopping condition is reached.
+</p>
+</div>
+
+<script>
+document.addEventListener("mouseup", () => {
+    const selection = window.getSelection().toString();
+    if (selection.length > 0) {
+        const textbox = document.querySelector("textarea");
+        if (textbox) {
+            textbox.value = selection;
+            textbox.dispatchEvent(new Event("input", { bubbles: true }));
+        }
+    }
+});
+</script>
+"""
+
+
+with gr.Blocks() as demo:
+    gr.Markdown("### 📘 Highlight text and ask GPT-5 for help")
+
+    gr.HTML(PAGE_HTML)
+
+    selected_text = gr.Textbox(
+        label="Selected text",
+        placeholder="Highlight text above...",
+        visible=False,
+    )
+
+    explain_btn = gr.Button("Explain selection 🧠")
+    output = gr.Markdown()
+
+    explain_btn.click(
+        fn=explain_text,
+        inputs=selected_text,
+        outputs=output,
+    )
+
+demo.launch()