Websites/interactives
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix invalid rule application feedback

Browse source 
Display a modal when an invalid rule is applied to premises, and return the rule to the "Drop rule" box.
This commit is contained in:
gpt-engineer-app[bot] 2025-08-11 10:02:41 +00:00
parent 58f4f99db5
commit 8f5eeb77a9
1 changed files with 22 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/components/RulesOfInferencePlayground.tsx
View file

@ -1,7 +1,8 @@
import { useEffect, useMemo, useState } from "react"; import { useEffect, useMemo, useState } from "react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { useToast } from "@/components/ui/use-toast"; import { useToast } from "@/hooks/use-toast";
import { AlertDialog, AlertDialogAction, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@/components/ui/alert-dialog";
// Rules of Inference Playground (Example 1: Resolution) // Rules of Inference Playground (Example 1: Resolution)
// Layout: 3 columns (Premises | Notepad lines with rule margin | Rules) // Layout: 3 columns (Premises | Notepad lines with rule margin | Rules)
@ -127,6 +128,7 @@ export default function RulesOfInferencePlayground() {
const [steps, setSteps] = useState<Step[]>([]); const [steps, setSteps] = useState<Step[]>([]);
const [activePremises, setActivePremises] = useState<string[]>([]); const [activePremises, setActivePremises] = useState<string[]>([]);
const [activeRule, setActiveRule] = useState<string | undefined>(undefined); const [activeRule, setActiveRule] = useState<string | undefined>(undefined);
const [showInvalidRuleModal, setShowInvalidRuleModal] = useState(false);
useEffect(() => { useEffect(() => {
// Reset when example changes // Reset when example changes
@ -203,11 +205,8 @@ export default function RulesOfInferencePlayground() {
// Validate again defensively // Validate again defensively
const valid = deriveCandidates(activeRule, activePremises).includes(result); const valid = deriveCandidates(activeRule, activePremises).includes(result);
if (!valid) { if (!valid) {
toast({ setShowInvalidRuleModal(true);
title: "Rule not applicable", setActiveRule(undefined); // Clear the rule from the drop zone
description: `The rule "${activeRule}" cannot be applied to the selected premises. Try a different rule or different premises.`,
variant: "destructive",
});
return; return;
} }
@ -395,6 +394,23 @@ export default function RulesOfInferencePlayground() {
</div> </div>
</div> </div>
</section> </section>
{/* Invalid Rule Modal */}
<AlertDialog open={showInvalidRuleModal} onOpenChange={setShowInvalidRuleModal}>
<AlertDialogContent className="bg-background border-border">
<AlertDialogHeader>
<AlertDialogTitle>Rule Not Applicable</AlertDialogTitle>
<AlertDialogDescription>
The selected rule cannot be applied to the chosen premises. Please try a different rule or select different premises.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogAction onClick={() => setShowInvalidRuleModal(false)}>
Try Again
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div> </div>
); );
} }