From 510f0529780071435395fee0792b5a73685c20b1 Mon Sep 17 00:00:00 2001
From: Thomas Hallock <thomas@evolutioniq.com>
Date: Mon, 17 Nov 2025 18:04:07 -0600
Subject: [PATCH] fix: scaffolding changes now apply in mastery+mixed mode
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

**Bug:** In mastery+mixed mode (operator=addition+subtraction), changing
scaffolding settings (e.g., answer boxes from "always" to "never") had no
effect. The worksheet continued using the old settings.

**Root Cause:**
- Mastery+mixed mode uses operator-specific display rules:
  - `additionDisplayRules` for addition problems
  - `subtractionDisplayRules` for subtraction problems
- ScaffoldingTab only updated the general `displayRules` field
- Typst generator prioritizes operator-specific rules when they exist
- User's changes were ignored

**Fix:**
- Detect mastery+mixed mode in ScaffoldingTab
- Update ALL three display rule fields when in this mode:
  - `displayRules` (general)
  - `additionDisplayRules` (for + problems)
  - `subtractionDisplayRules` (for - problems)
- Applies to both individual rule changes and preset buttons

**Testing:**
1. Set mode=mastery, operator=mixed
2. Change any scaffolding setting (e.g., answer boxes → never)
3. Preview should immediately reflect the change

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../config-sidebar/ScaffoldingTab.tsx         | 98 +++++++++++++------
 1 file changed, 66 insertions(+), 32 deletions(-)

diff --git a/apps/web/src/app/create/worksheets/components/config-sidebar/ScaffoldingTab.tsx b/apps/web/src/app/create/worksheets/components/config-sidebar/ScaffoldingTab.tsx
index 9315d14f..23796c12 100644
--- a/apps/web/src/app/create/worksheets/components/config-sidebar/ScaffoldingTab.tsx
+++ b/apps/web/src/app/create/worksheets/components/config-sidebar/ScaffoldingTab.tsx
@@ -15,13 +15,27 @@ export function ScaffoldingTab() {
 
   const displayRules: DisplayRules = formState.displayRules ?? defaultAdditionConfig.displayRules
 
+  // Check if we're in mastery+mixed mode (needs operator-specific rules)
+  const isMasteryMixed = formState.mode === 'mastery' && formState.operator === 'mixed'
+
   const updateRule = (key: keyof DisplayRules, value: DisplayRules[keyof DisplayRules]) => {
-    onChange({
-      displayRules: {
-        ...displayRules,
-        [key]: value,
-      },
-    })
+    const newDisplayRules = {
+      ...displayRules,
+      [key]: value,
+    }
+
+    // In mastery+mixed mode, update both general AND operator-specific display rules
+    if (isMasteryMixed) {
+      onChange({
+        displayRules: newDisplayRules,
+        additionDisplayRules: newDisplayRules,
+        subtractionDisplayRules: newDisplayRules,
+      })
+    } else {
+      onChange({
+        displayRules: newDisplayRules,
+      })
+    }
   }
 
   return (
@@ -47,19 +61,29 @@ export function ScaffoldingTab() {
         </div>
         <div className={css({ display: 'flex', gap: '1.5' })}>
           <button
-            onClick={() =>
-              onChange({
-                displayRules: {
-                  ...displayRules,
-                  carryBoxes: 'always',
-                  answerBoxes: 'always',
-                  placeValueColors: 'always',
-                  tenFrames: 'always',
-                  borrowNotation: 'always',
-                  borrowingHints: 'always',
-                },
-              })
-            }
+            onClick={() => {
+              const newDisplayRules = {
+                ...displayRules,
+                carryBoxes: 'always' as const,
+                answerBoxes: 'always' as const,
+                placeValueColors: 'always' as const,
+                tenFrames: 'always' as const,
+                borrowNotation: 'always' as const,
+                borrowingHints: 'always' as const,
+              }
+              // In mastery+mixed mode, update operator-specific rules too
+              if (isMasteryMixed) {
+                onChange({
+                  displayRules: newDisplayRules,
+                  additionDisplayRules: newDisplayRules,
+                  subtractionDisplayRules: newDisplayRules,
+                })
+              } else {
+                onChange({
+                  displayRules: newDisplayRules,
+                })
+              }
+            }}
             className={css({
               px: '2',
               py: '0.5',
@@ -76,19 +100,29 @@ export function ScaffoldingTab() {
             All Always
           </button>
           <button
-            onClick={() =>
-              onChange({
-                displayRules: {
-                  ...displayRules,
-                  carryBoxes: 'never',
-                  answerBoxes: 'never',
-                  placeValueColors: 'never',
-                  tenFrames: 'never',
-                  borrowNotation: 'never',
-                  borrowingHints: 'never',
-                },
-              })
-            }
+            onClick={() => {
+              const newDisplayRules = {
+                ...displayRules,
+                carryBoxes: 'never' as const,
+                answerBoxes: 'never' as const,
+                placeValueColors: 'never' as const,
+                tenFrames: 'never' as const,
+                borrowNotation: 'never' as const,
+                borrowingHints: 'never' as const,
+              }
+              // In mastery+mixed mode, update operator-specific rules too
+              if (isMasteryMixed) {
+                onChange({
+                  displayRules: newDisplayRules,
+                  additionDisplayRules: newDisplayRules,
+                  subtractionDisplayRules: newDisplayRules,
+                })
+              } else {
+                onChange({
+                  displayRules: newDisplayRules,
+                })
+              }
+            }}
             className={css({
               px: '2',
               py: '0.5',