refactor(challenge/instruction): Improve hint prompts and code

Author: pan93412

src/Twig/Components/Challenge/Instruction/Content.php

@@ -4,7 +4,6 @@
 
 namespace App\Twig\Components\Challenge\Instruction;
 
-use Symfony\Component\Serializer\SerializerInterface;
 use Symfony\UX\LiveComponent\Attribute\AsLiveComponent;
 use Symfony\UX\LiveComponent\Attribute\LiveArg;
 use Symfony\UX\LiveComponent\Attribute\LiveListener;
@@ -17,12 +16,15 @@ final class Content
     use DefaultActionTrait;
 
     #[LiveProp(writable: true)]
-    public ?HintPayload $hint = null;
+    public ?string $type = null;
+
+    #[LiveProp(writable: true)]
+    public ?string $hint = null;
 
     #[LiveListener('app:challenge-hint')]
-    public function onHintReceived(SerializerInterface $serializer, #[LiveArg] string $hint): void
+    public function onHintReceived(#[LiveArg] string $type, #[LiveArg] string $hint): void
     {
-        $deserializedHint = $serializer->deserialize($hint, HintPayload::class, 'json');
-        $this->hint = $deserializedHint;
+        $this->type = $type;
+        $this->hint = $hint;
     }
 }

src/Twig/Components/Challenge/Instruction/HintPayload.php

@@ -6,28 +6,37 @@
 
 use App\Entity\HintOpenEvent;
 use App\Entity\Question;
+use App\Entity\SolutionEventStatus;
 use App\Entity\User;
 use App\Repository\SolutionEventRepository;
+use App\Service\DbRunnerComparer;
 use App\Service\DbRunnerService;
 use App\Service\PointCalculationService;
 use App\Service\PromptService;
 use Doctrine\ORM\EntityManagerInterface;
 use Symfony\Component\DependencyInjection\ParameterBag\ParameterBagInterface;
 use Symfony\Component\HttpKernel\Exception\BadRequestHttpException;
-use Symfony\Component\Serializer\SerializerInterface;
+use Symfony\Component\Translation\TranslatableMessage;
 use Symfony\Contracts\Translation\TranslatorInterface;
 use Symfony\UX\LiveComponent\Attribute\AsLiveComponent;
 use Symfony\UX\LiveComponent\Attribute\LiveAction;
 use Symfony\UX\LiveComponent\Attribute\LiveProp;
 use Symfony\UX\LiveComponent\ComponentToolsTrait;
 use Symfony\UX\LiveComponent\DefaultActionTrait;
 
+use function Symfony\Component\Translation\t;
+
 #[AsLiveComponent]
 final class Modal
 {
     use ComponentToolsTrait;
     use DefaultActionTrait;
 
+    public function __construct(
+        private readonly TranslatorInterface $translator,
+    ) {
+    }
+
     #[LiveProp]
     public User $currentUser;
 
@@ -50,7 +59,6 @@ public function instruct(
         DbRunnerService $dbRunnerService,
         PromptService $promptService,
         TranslatorInterface $translator,
-        SerializerInterface $serializer,
         EntityManagerInterface $entityManager,
         ParameterBagInterface $parameterBag,
     ): void {
@@ -63,49 +71,77 @@ public function instruct(
 
         $query = $solutionEventRepository->getLatestQuery($this->question, $this->currentUser);
         if (null === $query) {
+            $this->flushHint('informative', t('instruction.hint.not_submitted'));
+
             return;
         }
+        if (SolutionEventStatus::Passed === $query->getStatus()) {
+            $this->flushHint('informative', t('instruction.hint.solved'));
 
-        $schema = $this->question->getSchema()->getSchema();
-        $answer = $this->question->getAnswer();
+            return;
+        }
 
-        $hintOpenEvent = (new HintOpenEvent())
-            ->setOpener($this->currentUser)
-            ->setQuestion($this->question)
-            ->setQuery($query->getQuery());
+        $schema = $query->getQuestion()->getSchema();
 
-        // run answer. if it failed, we should consider it an error
         try {
-            $answerResult = $dbRunnerService->runQuery($schema, $answer);
+            $answer = $query->getQuestion()->getAnswer();
+            $answerResult = $dbRunnerService->runQuery($schema->getSchema(), $answer);
         } catch (\Throwable $e) {
-            $this->emit('app:challenge-hint', [
-                'hint' => $serializer->serialize(HintPayload::fromError($e->getMessage()), 'json'),
-            ]);
+            $this->flushHint('informative', t('instruction.hint.error', [
+                '%error%' => $e->getMessage(),
+            ]));
 
             return;
         }
 
+        $hintOpenEvent = (new HintOpenEvent())
+            ->setOpener($this->currentUser)
+            ->setQuestion($this->question)
+            ->setQuery($query->getQuery());
+
         try {
-            // run query to get the error message (or compare the result)
-            $result = $dbRunnerService->runQuery($schema, $query->getQuery());
-        } catch (\Throwable $e) {
-            $hint = $promptService->hint($query->getQuery(), $e->getMessage(), $answer);
-        }
+            try {
+                $userResult = $dbRunnerService->runQuery($schema->getSchema(), $query->getQuery());
+            } catch (\Throwable $e) {
+                $hint = $promptService->hint($query->getQuery(), $e->getMessage(), $answer);
+                $hintOpenEvent->setResponse($hint);
 
-        if (isset($result) && $result !== $answerResult) {
-            $hint = $promptService->hint($query->getQuery(), 'Different output', $answer);
-        }
+                $this->flushHint('hint', $hint);
+
+                return;
+            }
+
+            $compareResult = DbRunnerComparer::compare($answerResult, $userResult);
+            if ($compareResult->correct()) {
+                $this->flushHint('informative', t('instruction.hint.solved'));
+
+                return;
+            }
 
-        if (!isset($hint)) {
-            $hint = $translator->trans('instruction.hint.no_hint');
+            $compareReason = $compareResult->reason()->trans($translator, 'en_US');
+            $hint = $promptService->hint($query->getQuery(), "Different result: {$compareReason}", $answer);
+            $hintOpenEvent->setResponse($hint);
+
+            $this->flushHint('hint', $hint);
+        } finally {
+            $entityManager->persist($hintOpenEvent);
+            $entityManager->flush();
         }
+    }
 
+    /**
+     * Flush the hint to the client.
+     *
+     * @param string                     $type the type of the hint (informative or hint)
+     * @param string|TranslatableMessage $hint the hint to flush
+     */
+    private function flushHint(string $type, string|TranslatableMessage $hint): void
+    {
         $this->emit('app:challenge-hint', [
-            'hint' => $serializer->serialize(HintPayload::fromHint($hint), 'json'),
+            'type' => $type,
+            'hint' => $hint instanceof TranslatableMessage
+                ? $hint->trans($this->translator)
+                : $hint,
         ]);
-
-        $hintOpenEvent = $hintOpenEvent->setResponse($hint);
-        $entityManager->persist($hintOpenEvent);
-        $entityManager->flush();
     }
 }

src/Twig/Components/Challenge/Instruction/Modal.php

@@ -1,13 +1,18 @@
 <div{{ attributes }}>
-    {% if hint and hint.error %}
-        <div class="alert alert-danger" role="alert">
-            <h4 class="alert-heading">無法取得提示</h4>
-            <p>{{ hint.error }}</p>
-        </div>
-    {% elseif hint and hint.hint %}
-        <div class="alert alert-info" role="alert">
-            <h4 class="alert-heading">提示</h4>
-            <p>{{ hint.hint|markdown_to_html }}</p>
-        </div>
+    {% if hint %}
+        {% if type == 'informative' %}
+            <div class="alert alert-warning" role="alert">
+                {{ hint }}
+            </div>
+        {% elseif type == 'hint' %}
+            <div class="alert alert-info" role="alert">
+                <h4 class="alert-heading">提示</h4>
+                <p>{{ hint|markdown_to_html }}</p>
+            </div>
+        {% else %}
+            <div class="alert alert-danger" role="alert">
+                <p>發現一個未知類型的提示（{{ type }}：{{ hint }}）</p>
+            </div>
+        {% endif %}
     {% endif %}
 </div>

templates/components/Challenge/Instruction/Content.html.twig

@@ -0,0 +1,8 @@
+challenge:
+  compare-result:
+    same: The answers are completely identical.
+    empty-answer: The correct answer has no fields, which usually indicates that the query statement written by the questioner is incorrect. Please report this to us.
+    empty-result: Your answer has no fields, which usually indicates that the query statement is incorrect.
+    column-different: The column names differ; please compare and modify according to the correct answer.
+    row-different: The %row% row you answered is different from the correct answer.
+    row-unmatched: The number of returned rows does not match the correct answer (the correct answer has %expected% rows, while you answered %actual% rows).

translations/messages.en_US.yaml

@@ -98,7 +98,9 @@ charts:
 
 instruction:
   hint:
-    no_hint: 沒有提示。
+    not_submitted: 提交答案之後才能請 GPT 提示。
+    solved: 正確答案不需要提示。
+    error: 無法取得正確答案：%error%
 
 feedback:
   type: