b67517e41b
A page to try a review classification against a real PR: repo, PR number and one or more classifications (name, description, polarity, threshold). Run posts to the controller's try-out endpoint and polls until the run is done or failed, saying it is running meanwhile, then shows the review's table, the overall verdict and the head commit. A row that could not run shows its error in place of a reason, and a failed run shows its error. The inputs stay so the run can be edited and repeated. Nothing is stored and nothing is posted to the forge. Route, nav entry and a section in docs/swarm/ui.md.
65 lines
2.2 KiB
TypeScript
65 lines
2.2 KiB
TypeScript
// <ClassificationEditor> — the fields of one review classification: a name, a
|
||
// description (the prompt the model answers), which answer passes, and how
|
||
// certain the model has to be for its answer to count.
|
||
import { Button } from "../../ui/button/Button.js";
|
||
import { SelectField } from "../../ui/select-field/SelectField.js";
|
||
import { TextAreaField } from "../../ui/text-area-field/TextAreaField.js";
|
||
import { TextField } from "../../ui/text-field/TextField.js";
|
||
import type { ClassificationDraft, Polarity } from "./TryOutTypes.js";
|
||
import "./ReviewTryOutPage.css";
|
||
|
||
const POLARITY_OPTIONS = [
|
||
{ value: "positive", label: "positive — the PR should match" },
|
||
{ value: "negative", label: "negative — the PR should not match" },
|
||
];
|
||
|
||
export function ClassificationEditor({
|
||
draft,
|
||
onChange,
|
||
onRemove,
|
||
}: {
|
||
draft: ClassificationDraft;
|
||
onChange: (next: ClassificationDraft) => void;
|
||
/** Absent when this is the only classification: one is the minimum. */
|
||
onRemove?: () => void;
|
||
}) {
|
||
const id = `tryout-${draft.key}`;
|
||
return (
|
||
<div class="ui-tryout-classification">
|
||
<TextField
|
||
id={`${id}-name`}
|
||
label="name"
|
||
value={draft.name}
|
||
placeholder="e.g. datetime"
|
||
onInput={(name) => onChange({ ...draft, name })}
|
||
/>
|
||
<TextAreaField
|
||
id={`${id}-description`}
|
||
label="description"
|
||
value={draft.description}
|
||
rows={4}
|
||
placeholder="what to look for in the PR, e.g. does it add a naive datetime?"
|
||
onInput={(description) => onChange({ ...draft, description })}
|
||
/>
|
||
<div class="ui-tryout-classification-row">
|
||
<SelectField
|
||
id={`${id}-polarity`}
|
||
label="polarity"
|
||
value={draft.polarity}
|
||
options={POLARITY_OPTIONS}
|
||
onChange={(polarity) =>
|
||
onChange({ ...draft, polarity: polarity as Polarity })
|
||
}
|
||
/>
|
||
<TextField
|
||
id={`${id}-threshold`}
|
||
label="threshold (0–100)"
|
||
value={draft.threshold}
|
||
pattern="[0-9]+"
|
||
onInput={(threshold) => onChange({ ...draft, threshold })}
|
||
/>
|
||
{onRemove ? <Button onClick={onRemove}>remove</Button> : null}
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|