File size: 6,086 Bytes
0921a5d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c4cdd5b
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
dcd83c5
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
73da37e
 
 
 
 
 
 
 
 
 
 
 
0921a5d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
73da37e
0921a5d
 
 
 
73da37e
0921a5d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
from __future__ import annotations

from html import escape
import gradio as gr

# Examples cover math, science, reading, and writing support.
EXAMPLE_CARDS = [
    {
        "title": "Fraction Word Problem",
        "grade": "Middle school",
        "mode": "Coach me",
        "text": "A recipe uses 3/4 cup of flour for one batch. How much flour is needed for 2 1/2 batches?",
    },
    {
        "title": "Physics Units",
        "grade": "High school",
        "mode": "Step-by-step",
        "text": "If a bike travels 18 meters in 6 seconds, what is its average speed? I keep mixing up the units.",
    },
    {
        "title": "Reading Evidence",
        "grade": "Middle school",
        "mode": "Hint only",
        "text": "The question asks which sentence best shows the narrator is nervous. How do I choose evidence without guessing?",
    },
    {
        "title": "Essay Thesis",
        "grade": "High school",
        "mode": "Coach me",
        "text": "My essay is about whether school uniforms help students focus. My thesis sounds too broad.",
    },
    {
        "title": "Algebra Check",
        "grade": "High school",
        "mode": "Step-by-step",
        "text": "Solve 2x + 7 = 19. I know the answer is x = 6, but I want to understand the steps.",
    },
    {
        "title": "Science Claim",
        "grade": "Middle school",
        "mode": "Hint only",
        "text": "The lab question asks why metal spoons feel colder than wooden spoons. I need help explaining the idea without memorizing words.",
    },
    {
        "title": "Reading Theme",
        "grade": "Middle school",
        "mode": "Coach me",
        "text": "The story has a character who keeps checking the door and looking at the clock. I need help explaining the mood with evidence.",
    },
    {
        "title": "Geometry Help",
        "grade": "High school",
        "mode": "Step-by-step",
        "text": "A triangle has angles 45 degrees and 65 degrees. What is the third angle, and why?",
    },
    {
        "title": "Statistics Question",
        "grade": "College",
        "mode": "Coach me",
        "text": "My dataset has a mean of 14 and a median of 9. How do I explain what that says about the shape of the data?",
    },
    {
        "title": "Parent Note",
        "grade": "Elementary",
        "mode": "Hint only",
        "text": "My child says 9 minus 4 equals 6. I want help giving a calm hint instead of just correcting them.",
    },
    {
        "title": "Equation Steps",
        "grade": "High school",
        "mode": "Coach me",
        "text": "Can you show me how to solve 3(2x - 5) = 21 without jumping straight to the answer?",
    },
    {
        "title": "Lab Result",
        "grade": "College",
        "mode": "Step-by-step",
        "text": "My chemistry lab data has weird outliers. How do I explain what might be happening without sounding vague?",
    },
    {
        "title": "History Claim",
        "grade": "Middle school",
        "mode": "Hint only",
        "text": "The prompt asks how the setting affects the story. I know where it happens, but I do not know how to turn that into evidence.",
    },
    {
        "title": "Word Problem",
        "grade": "Elementary",
        "mode": "Coach me",
        "text": "There are 24 apples and 6 baskets. If the apples are shared equally, how many go in each basket?",
    },
    {
        "title": "Ratio Reasoning",
        "grade": "Middle school",
        "mode": "Step-by-step",
        "text": "A map uses a scale of 1 inch to 5 miles. If two towns are 3.5 inches apart on the map, how far apart are they in real life?",
    },
    {
        "title": "Poem Tone",
        "grade": "High school",
        "mode": "Hint only",
        "text": "The poem uses dark weather and broken glass imagery. How do I explain the tone without sounding too dramatic?",
    },
]


def _example_card_html(title: str, grade: str, text: str) -> str:
    """Builds a compact example card with clear grade context."""
    return (
        '<div class="pt-example-copy">'
        '<div class="pt-example-head">'
        f"<span>{escape(title)}</span>"
        f"<strong>{escape(grade)}</strong>"
        "</div>"
        f"<p>{escape(text)}</p>"
        "</div>"
    )


def _select_example(
    text: str, grade: str, mode: str
) -> tuple[None, str, None, str, str]:
    """Populates the tutor form from an example card."""
    return None, text, None, grade, mode


def render_examples(
    image_input: gr.Image,
    question_input: gr.Textbox,
    audio_input: gr.Audio,
    grade_input: gr.Radio,
    mode_input: gr.Radio,
) -> gr.Column:
    """Renders examples and wires card buttons to the tutor form."""
    with gr.Column(elem_classes=["pt-examples-section"]) as section:
        gr.Markdown("## Example Situations")
        with gr.Row(elem_classes=["pt-example-grid"]):
            for example in EXAMPLE_CARDS:
                with gr.Column(elem_classes=["pt-example-card"]):
                    gr.HTML(
                        _example_card_html(
                            str(example["title"]),
                            str(example["grade"]),
                            str(example["text"]),
                        )
                    )
                    use_example = gr.Button(
                        "Use example",
                        size="sm",
                        elem_classes=["pt-example-btn"],
                    )
                    use_example.click(
                        fn=lambda text=str(example["text"]), grade=str(example["grade"]), mode=str(example["mode"]): (
                            _select_example(text, grade, mode)
                        ),
                        inputs=[],
                        outputs=[
                            image_input,
                            question_input,
                            audio_input,
                            grade_input,
                            mode_input,
                        ],
                        queue=False,
                    )
    return section