def image_math_reasoning_tab()

in gemini/sample-apps/gemini-mesop-cloudrun/main.py [0:0]

• 61 lines of code
• 2 McCabe index (conditional complexity)

def image_math_reasoning_tab() -> None:
    """Image math reasoning tab"""
    state = me.state(State)
    me.box(style=me.Style(height=12))
    me.text("Math Reasoning", style=me.Style(font_weight="bold"))
    me.box(style=me.Style(height=12))

    me.text(
        "Gemini 2.0 Pro can also recognize math formulas and equations and extract specific information from them. This capability is particularly useful for generating explanations for math problems, as shown below."
    )
    me.box(style=me.Style(height=12))

    with me.box(
        style=me.Style(display="grid", gap=0, grid_template_columns="repeat(4, 1fr)")
    ):
        with me.box(
            style=me.Style(
                display="grid",
                flex_direction="column",
                gap=2,
            )
        ):
            me.image(
                src=IMAGE_MATH,
                alt="math equation ",
                style=me.Style(width="350px"),
            )
            with me.box(
                style=me.Style(align_content="center", flex_grow=1, display="flex")
            ):
                me.text(
                    "image of a math equation",
                    style=me.Style(color="rgba(49, 51, 63, 0.6)", font_size="14px"),
                )
    me.box(style=me.Style(height=12))

    me.text("Our expectation: Ask questions about the math equation as follows:")
    me.markdown(
        text="* Extract the formula.\n* What is the symbol right before Pi? What does it mean?\n* Is this a famous formula? Does it have a name?"
    )

    with me.box(style=me.Style(display="flex", gap=10, padding=me.Padding(bottom=20))):
        me.button(
            "Clear", color="primary", type="stroked", on_click=on_click_clear_math
        )
        me.button(
            "Generate answers",
            color="primary",
            type="flat",
            on_click=generate_math_answers,
        )

    with me.box(style=_BOX_STYLE):
        me.text("Recommendation", style=me.Style(font_weight=500))
        if state.math_answers_output:
            with me.box(
                style=me.Style(
                    display="grid",
                    justify_content="center",
                    justify_items="center",
                )
            ):
                me.markdown(
                    key="math_answers_output",
                    text=state.math_answers_output,
                    style=me.Style(width="100%", margin=me.Margin(top=10)),
                )