Problem page component for the AutoSuggestion Quiz application.
- Source:
Methods
(inner) ProblemPage(props) → {React.ReactElement}
A full-page coding environment that presents a problem description alongside a Monaco editor. Features include:
- Per-problem AI autocompletion suggestions that trigger after 2 seconds of idle typing.
- In-browser Python execution via Pyodide.
- Mock execution for non-Python languages.
- A suggestion log that records every accepted AI suggestion.
Parameters:
| Name | Type | Description | |||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
props |
Object |
Properties
|
- Source:
Returns:
The rendered problem page.
- Type
- React.ReactElement
Example
<ProblemPage problem={selectedProblem} onBack={() => setPage('home')} />(inner) provideCompletionItems()
Provides AI completion items at the current cursor position.
Parameters:
| Type | Description |
|---|---|
- Source:
Returns:
Type Definitions
Example
Type:
- Object
Properties:
| Name | Type | Attributes | Description |
|---|---|---|---|
input |
string | The example input value. |
|
output |
string | The expected output for the given input. |
|
explanation |
string |
<optional> |
Optional explanation of why the output is correct. |
- Source:
Problem
Type:
- Object
Properties:
| Name | Type | Description |
|---|---|---|
id |
string | Unique identifier used to look up AI suggestions. |
title |
string | Display title of the problem. |
description |
string | Full problem description shown to the user. |
starterCode |
Object.<string, string> | Map of language key to starter code string (e.g. |
examples |
Array.<Example> | List of input/output examples shown in the problem panel. |
- Source:
SuggestionLogEntry
Type:
- Object
Properties:
| Name | Type | Description |
|---|---|---|
time |
string | Locale time string of when the suggestion was accepted. |
action |
'accepted' | The action taken on the suggestion. |
label |
string | The label of the accepted suggestion. |
- Source: