Skip to content

Commit

Permalink
feat(editor): compare llm responses
Browse files Browse the repository at this point in the history
  • Loading branch information
@lionelB
lionelB committed Jul 25, 2024
1 parent 1671a64 commit 8d1ad46
Show file tree
Hide file tree
Showing 3 changed files with 154 additions and 74 deletions.
124 changes: 84 additions & 40 deletions pix-editor/app/components/competence/alternatives/generation.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,50 +26,94 @@
/>
</div>
<div class="alternative-generation__alternatives">
{{#each this.alternatives as |alternative index|}}
<hr class="alternative-generation__separator" />
<div class="alternative-generation__item">
<PixCheckbox
@id="checkbox-alternative-{{index}}"
@checked={{alternative.checked}}
{{on "change" (fn this.toggleAlternatives index)}}
/>
<div>
<PixTextarea
@id="alternative-{{index}}"
@value={{alternative.instruction}}
class={{if
alternative.checked
"alternative-generation__item--selected"
}}
>
<:label>{{alternative.label}}</:label>
</PixTextarea>
<div class="alternative-generation__item-answers">
<div>
<h3
class="alternative-generation__item-answers-title correct"
>
Bonne réponse
</h3>
<code>{{alternative.correctAnswer}}</code>
<div>
{{#each this.alternatives as |alternative index|}}
<hr class="alternative-generation__separator" />
<div class="alternative-generation__item">

<div>
<PixTextarea
@id="alternative-{{index}}"
@value={{alternative.instruction}}
class={{if
alternative.checked
"alternative-generation__item--selected"
}}
>
<:label>{{alternative.label}}</:label>
</PixTextarea>
<div class="alternative-generation__item-answers">
<div>
<h3
class="alternative-generation__item-answers-title correct"
>
Bonne réponse
</h3>
<code>{{alternative.correctAnswer}}</code>
</div>
<div>
<h3
class="alternative-generation__item-answers-title wrong"
>
Mauvaises réponses
</h3>
<ul>
{{#each alternative.wrongAnswers as |wrongAnswer index|}}
<li>
<code>{{wrongAnswer}}</code>
</li>
{{/each}}
</ul>
</div>
</div>
<div>
<h3 class="alternative-generation__item-answers-title wrong">
Mauvaises réponses
</h3>
<ul>
{{#each alternative.wrongAnswers as |wrongAnswer index|}}
<li>
<code>{{wrongAnswer}}</code>
</li>
{{/each}}
</ul>
</div>
</div>
{{/each}}
</div>
<div>
{{#each this.alternativesWithExamples as |alternative index|}}
<hr class="alternative-generation__separator" />
<div class="alternative-generation__item">

<div>
<PixTextarea
@id="alternative-{{index}}"
@value={{alternative.instruction}}
class={{if
alternative.checked
"alternative-generation__item--selected"
}}
>
<:label>{{alternative.label}}</:label>
</PixTextarea>
<div class="alternative-generation__item-answers">
<div>
<h3
class="alternative-generation__item-answers-title correct"
>
Bonne réponse
</h3>
<code>{{alternative.correctAnswer}}</code>
</div>
<div>
<h3
class="alternative-generation__item-answers-title wrong"
>
Mauvaises réponses
</h3>
<ul>
{{#each alternative.wrongAnswers as |wrongAnswer index|}}
<li>
<code>{{wrongAnswer}}</code>
</li>
{{/each}}
</ul>
</div>
</div>
</div>
</div>
</div>
{{/each}}
{{/each}}
</div>
</div>
{{/if}}
</:content>
Expand Down
97 changes: 64 additions & 33 deletions pix-editor/app/components/competence/alternatives/generation.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,13 @@ import Component from "@glimmer/component";
import { action } from "@ember/object";
import { tracked } from "@glimmer/tracking";
import { inject as service } from "@ember/service";
import ChallengeModel from "../../../models/challenge";

export default class AlternativeGeneration extends Component {
@tracked isLoading = false;
@tracked showModal = false;
@tracked alternatives = [];
@tracked alternativesWithExamples = [];

@service config;

@action
Expand All @@ -20,46 +21,31 @@ export default class AlternativeGeneration extends Component {
this.isLoading = true;
this.toggleModal();

const response = await fetch(
`${this.config.llmVariationsUrl}/variations-from-examples`,
{
method: "POST",
headers: {
"Content-type": "application/json",
Authorization: this.config.llmVariationsToken,
},
body: JSON.stringify({
challenge: {
skillDescription:
this.args.challenge.skill.get("description") || "",
tubeDescription:
this.args.challenge.skill
.get("tube")
.get("practicalDescriptionFr") || "",
instruction: this.args.challenge.instruction,
locale: this.args.challenge.locales[0],
},
examples: this.args.challenge.skill
.get("validatedChallenges")
.map((challenge) => ({
instruction: challenge.instruction,
answer: extractResponseFromChallenge(challenge),
})),
}),
}
);
const [response, responseWithExamples] = await Promise.all([
this.fetchVariations(),
this.fetchVariationsWithExamples(),
]);

//
const json = await response.json();
const jsonWithExamples = await responseWithExamples.json();

this.alternatives = json.variations.map((alternative, index) => {
console.log(alternative);
return {
...alternative,
checked: false,
label: `Déclinaison ${index + 1}`,
};
});

console.log(this.alternatives);

this.alternativesWithExamples = jsonWithExamples.variations.map(
(alternative, index) => {
return {
...alternative,
checked: false,
label: `Déclinaison ${index + 1}`,
};
}
);
this.isLoading = false;
}

Expand All @@ -77,6 +63,51 @@ export default class AlternativeGeneration extends Component {
get selectedAlternativesCount() {
return this.alternatives.filter(({ checked }) => checked).length;
}

fetchVariations() {
return fetch(`${this.config.llmVariationsUrl}/variations`, {
method: "POST",
headers: {
"Content-type": "application/json",
Authorization: this.config.llmVariationsToken,
},
body: JSON.stringify({
skillDescription: this.args.challenge.skill.get("description") || "",
tubeDescription:
this.args.challenge.skill.get("tube").get("practicalDescriptionFr") ||
"",
instruction: this.args.challenge.instruction,
locale: this.args.challenge.locales[0],
}),
});
}

fetchVariationsWithExamples() {
return fetch(`${this.config.llmVariationsUrl}/variations-from-examples`, {
method: "POST",
headers: {
"Content-type": "application/json",
Authorization: this.config.llmVariationsToken,
},
body: JSON.stringify({
challenge: {
skillDescription: this.args.challenge.skill.get("description") || "",
tubeDescription:
this.args.challenge.skill
.get("tube")
.get("practicalDescriptionFr") || "",
instruction: this.args.challenge.instruction,
locale: this.args.challenge.locales[0],
},
examples: this.args.challenge.skill
.get("validatedChallenges")
.map((challenge) => ({
instruction: challenge.instruction,
answer: extractResponseFromChallenge(challenge),
})),
}),
});
}
}

function extractResponseFromChallenge(challenge) {
Expand Down
7 changes: 6 additions & 1 deletion pix-editor/app/styles/components/alternative-generation.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,15 @@
.alternative-generation__separator {
margin: 20px 0;
}
.alternative-generation__alternatives {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}

.alternative-generation__item {
display: grid;
grid-template-columns: auto 1fr;
grid-template-columns: 1fr;
gap: 20px;

&:not(:first-child) {
Expand Down

0 comments on commit 8d1ad46

Please sign in to comment.