@nualang/nualang-ui-components 0.1.1435 → 0.1.1436

package/dist/Cards/FeedbackCard/FeedbackCard.js

@@ -55,6 +55,10 @@ export default function FeedbackCard({
   userData = [],
   hasSubmission = false,
   aiGrade = {},
+  // Discuss AI feedback, already combined with the all-AI switch. It stops new
+  // AI feedback being generated; assessments already saved stay visible, since
+  // a teacher may have set them.
+  isDiscussAIFeedbackEnabled = true,
   onGenerateFeedback = () => {},
   onSubmitFeedback = () => {},
   setSelectedRecording = () => {},
@@ -201,6 +205,7 @@ export default function FeedbackCard({
     }
   }, [submitTrigger]);
   const handleGenerateAI = async () => {
+    if (!isDiscussAIFeedbackEnabled) return;
     setAiJustGenerated(true);
     setIsGeneratingFeedback(true);
     setIsGeneratingIndividual(true);
@@ -566,7 +571,7 @@ export default function FeedbackCard({
                   disabled: !hasSubmission || isGeneratingFeedback,
                   onClick: handleOpenRecordingDialog,
                   children: t("view_recording")
-                }), /*#__PURE__*/_jsx(Button, {
+                }), isDiscussAIFeedbackEnabled && /*#__PURE__*/_jsx(Button, {
                   variant: "contained",
                   color: "secondary",
                   disabled: !hasSubmission || isGeneratingFeedback,

package/dist/Dialogs/DynamicAIWarning/DynamicAIWarning.js

@@ -23,7 +23,7 @@ function DynamicAIWarning({
   return /*#__PURE__*/_jsxs(ResponsiveDialog, {
     open: open,
     handleClose: handleClose,
-    submitText: t("classroom_settings"),
+    submitText: t("ai_settings"),
     dialogTitle: dialogTitle,
     children: [/*#__PURE__*/_jsxs(Box, {
       sx: {
@@ -168,7 +168,7 @@ function DynamicAIWarning({
             fontWeight: "bold"
           },
           onClick: submit,
-          children: t("classroom_settings")
+          children: t("ai_settings")
         }), " ", "for this class."]
       })]
     }), /*#__PURE__*/_jsx(Divider, {

package/dist/Dialogs/GroupedFeedbackDialog/GroupedFeedbackDialog.js

@@ -28,6 +28,9 @@ export default function GroupFeedbackDialog({
   t = x => x,
   handleBatchGradeConversations = () => {},
   aiGrade = {},
+  // Discuss AI feedback, already combined with the all-AI switch, so the
+  // generate controls disappear when either is off.
+  isDiscussAIFeedbackEnabled = true,
   selectedGroup = {},
   setSelectedRecording = () => {},
   selectedRecording = {},
@@ -200,7 +203,7 @@ export default function GroupFeedbackDialog({
     }).filter(member => member.name !== "Unknown");
   };
   const handleGenerateFeedback = async discussionData => {
-    if (!handleBatchGradeConversations) return;
+    if (!isDiscussAIFeedbackEnabled || !handleBatchGradeConversations) return;
     setIsGeneratingIndividual(true);
     try {
       const joinedMembersWithNames = getJoinedMembersNames(discussionData.joinedMembers || [], userData);
@@ -243,7 +246,7 @@ export default function GroupFeedbackDialog({
         customFeedback: customFeedbackText
       };
     });
-    if (conversationsToGrade.length > 0 && handleBatchGradeConversations) {
+    if (isDiscussAIFeedbackEnabled && conversationsToGrade.length > 0 && handleBatchGradeConversations) {
       setIsGeneratingAll(true);
       setGenerateAllUsed(true);
       try {
@@ -546,7 +549,7 @@ export default function GroupFeedbackDialog({
               sx: {
                 flex: 1
               }
-            }), /*#__PURE__*/_jsx(Button, {
+            }), isDiscussAIFeedbackEnabled && /*#__PURE__*/_jsx(Button, {
               variant: "contained",
               color: "secondary",
               endIcon: /*#__PURE__*/_jsx(AutoFixHighIcon, {}),
@@ -603,6 +606,7 @@ export default function GroupFeedbackDialog({
               existingFeedback: feedbackByMeetingId[feedbackMeetingId] || {},
               onGenerateFeedback: () => openCustomPromptForSingle(discussionData),
               onSubmitFeedback: handleSubmitFeedback,
+              isDiscussAIFeedbackEnabled: isDiscussAIFeedbackEnabled,
               setSelectedRecording: setSelectedRecording,
               selectedRecording: selectedRecording,
               s3Url: s3Url,

package/dist/Dialogs/GroupedFeedbackDialog/GroupedFeedbackDialog.test.js

@@ -0,0 +1,39 @@
+import { render } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import { createTheme, ThemeProvider } from "@mui/material/styles";
+import GroupedFeedbackDialog from "./GroupedFeedbackDialog";
+import { WithData } from "./GroupedFeedbackDialog.stories";
+
+// This repo has no jest-dom matchers and no auto-cleanup, so assertions are
+// plain and each test unmounts - matching AISettings.test.jsx.
+import { jsx as _jsx } from "react/jsx-runtime";
+const setup = (props = {}) => render(/*#__PURE__*/_jsx(ThemeProvider, {
+  theme: createTheme(),
+  children: /*#__PURE__*/_jsx(GroupedFeedbackDialog, {
+    ...WithData.args,
+    ...props
+  })
+}));
+describe("GroupedFeedbackDialog AI controls", () => {
+  it("offers feedback generation when the classroom allows AI", () => {
+    const {
+      queryAllByText,
+      unmount
+    } = setup();
+    expect(queryAllByText("generate_feedback").length).toBeGreaterThan(0);
+    unmount();
+  });
+  it("removes every generate control when the classroom limits AI", () => {
+    // Teachers can still write and submit their own feedback - only the AI
+    // route away from the page is closed.
+    const {
+      queryAllByText,
+      unmount
+    } = setup({
+      isDiscussAIFeedbackEnabled: false
+    });
+    expect(queryAllByText("generate_feedback").length).toBe(0);
+    expect(queryAllByText("submit_feedback").length).toBeGreaterThan(0);
+    unmount();
+  });
+});

package/dist/Dialogs/QuickCreateClassroomDialog/QuickCreateClassroomDialog.js

@@ -145,7 +145,6 @@ export default function QuickCreateClassroomDialog({
         visibility: "private",
         vchatEnabled: true,
         vchatEnabledInSettings: true,
-        isDynamicResponsesEnabled: "enabled",
         enrolmentKey: generateRandomEnrolmentKey(),
         allowedDomains: [],
         collaborators: [],

package/dist/Exercises/Bot/Bot.js

@@ -29,8 +29,8 @@ import ReportProblem from "../../Misc/ReportProblem/ReportProblem";
 import NualaSignInImage from "../../img/nuala_sign_in.svg";
 import { startJoyrideWhenReady } from "../../utils/joyride";
 import { collectCorrections } from "../../utils/correction";
-import { getDynamicResponsesSetting } from "../../utils/dynamicResponses";
 import { getBotContentTemplateType } from "../../utils";
+import { AI_ENABLED, courseAIValue, isCourseAIEnabled } from "../../utils/aiControls";
 import { useTheme } from "@mui/material/styles";
 import config from "../../config";
 import { useNavigate } from "react-router";
@@ -288,11 +288,17 @@ function Bot({
     } = getRecognitionParams();
     toggleListen(learnLang, speechContexts, model, undefined, autoStopOptions);
   };
-  const isDynamicResponsesClassroomEnabled = getDynamicResponsesSetting({
-    botSetting: isDynamicResponsesEnabled,
-    parentClassroom,
-    courseSettings
-  });
+
+  // The classroom's all-AI and chatbot switches, and the course's, can each
+  // silence dynamic responses whatever the bot's own setting. Only when they
+  // allow AI does the bot's setting decide - except for courses saved as
+  // "enabled", which older classroom records can still carry.
+  let isDynamicResponsesClassroomEnabled = isDynamicResponsesEnabled;
+  if (!isCourseAIEnabled(parentClassroom, courseSettings)) {
+    isDynamicResponsesClassroomEnabled = "disable";
+  } else if (courseAIValue(courseSettings) === AI_ENABLED) {
+    isDynamicResponsesClassroomEnabled = "enable";
+  }
   const exerciseState = useExerciseState({
     t,
     open,

package/dist/Forms/CreateClassroom/Steps/AISettings/AISettings.js

@@ -0,0 +1,235 @@
+import { useEffect, useRef } from "react";
+import * as Yup from "yup";
+import { Alert, Box, FormControl, FormControlLabel, FormLabel, Grid, IconButton, Radio, RadioGroup, Tooltip, Typography } from "@mui/material";
+import HelpIcon from "@mui/icons-material/Help";
+import SearchIcon from "@mui/icons-material/Search";
+import EastIcon from "@mui/icons-material/East";
+import { AI_DISABLED, AI_ENABLED, AI_FIELDS, aiLockedBy, classroomAIValue, courseAIValue } from "../../../../utils/aiControls";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const AI_INFO_URL = "https://www.waysidepublishing.com/digital-solutions/ai-safety-and-trust";
+
+// One Allowed / Limited choice for one of AI_FIELDS.
+function AISwitch({
+  t,
+  name,
+  label,
+  description,
+  info,
+  value,
+  disabled,
+  dataCy,
+  handleChange,
+  handleBlur
+}) {
+  return /*#__PURE__*/_jsxs(FormControl, {
+    component: "fieldset",
+    children: [/*#__PURE__*/_jsxs(FormLabel, {
+      component: "legend",
+      children: [t(label), info && /*#__PURE__*/_jsx(Tooltip, {
+        title: t(info),
+        placement: "right",
+        children: /*#__PURE__*/_jsx(IconButton, {
+          sx: {
+            padding: 0,
+            marginLeft: 1
+          },
+          children: /*#__PURE__*/_jsx(HelpIcon, {
+            fontSize: "small"
+          })
+        })
+      })]
+    }), /*#__PURE__*/_jsx(Typography, {
+      color: "textSecondary",
+      children: t(description)
+    }), /*#__PURE__*/_jsxs(RadioGroup, {
+      row: true,
+      "aria-label": name,
+      name: name,
+      value: value,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      children: [/*#__PURE__*/_jsx(FormControlLabel, {
+        value: AI_ENABLED,
+        control: /*#__PURE__*/_jsx(Radio, {}),
+        label: t("ai_allowed"),
+        disabled: disabled,
+        "data-cy": `allow-${dataCy}-in-settings`
+      }), /*#__PURE__*/_jsx(FormControlLabel, {
+        value: AI_DISABLED,
+        control: /*#__PURE__*/_jsx(Radio, {}),
+        label: t("ai_limited"),
+        disabled: disabled,
+        "data-cy": `limit-${dataCy}-in-settings`
+      })]
+    })]
+  });
+}
+
+// The classroom's AI section: a switch for all AI, and one each for chatbot
+// dynamic responses and Discuss AI feedback. Per-course chatbot overrides stay
+// in Course Settings, so this section only reports them.
+function AISettings({
+  t = text => text,
+  values,
+  handleChange,
+  handleBlur,
+  courses = [],
+  courseSettings = {},
+  scrollToDynamicResponses = false,
+  setScrollToDynamicResponses,
+  // The saved classroom record, which the API stamps with `aiLockedBy` when
+  // the classroom's customer has limited AI. `values` is only the form state.
+  classroom
+}) {
+  const aiControlRef = useRef(null);
+  useEffect(() => {
+    // Guarded: the notice can fire before this section has mounted.
+    if (scrollToDynamicResponses && aiControlRef.current) {
+      aiControlRef.current.scrollIntoView({
+        behavior: "smooth",
+        block: "center"
+      });
+      setScrollToDynamicResponses && setScrollToDynamicResponses(false);
+    }
+  }, [scrollToDynamicResponses]);
+  const isAllLimited = classroomAIValue(values) === AI_DISABLED;
+  const isAllLocked = Boolean(aiLockedBy(classroom));
+
+  // While all AI is off, a feature shows as limited - which is what students
+  // get - but keeps its own value for when all AI is turned back on.
+  const featureValue = field => isAllLimited ? AI_DISABLED : classroomAIValue(values, field);
+  const isChatbotLimited = featureValue(AI_FIELDS.chatbot) === AI_DISABLED;
+
+  // Courses that have turned the chatbot off for themselves. Read from the
+  // saved classroom, so this is what students currently get.
+  const overriddenCourses = courses.filter(course => courseAIValue(courseSettings?.[course.courseId]) === AI_DISABLED);
+  const switchProps = {
+    t,
+    handleChange,
+    handleBlur
+  };
+  return /*#__PURE__*/_jsxs(Grid, {
+    container: true,
+    spacing: 2,
+    ref: aiControlRef,
+    children: [/*#__PURE__*/_jsxs(Grid, {
+      size: 12,
+      children: [/*#__PURE__*/_jsx(Typography, {
+        color: "textSecondary",
+        gutterBottom: true,
+        children: t("ai_settings_desc")
+      }), /*#__PURE__*/_jsxs(Box, {
+        component: "a",
+        href: AI_INFO_URL,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        sx: {
+          display: "inline-flex",
+          alignItems: "center",
+          textDecoration: "none",
+          color: "primary.main"
+        },
+        children: [/*#__PURE__*/_jsx(SearchIcon, {
+          sx: {
+            mr: 0.5
+          },
+          fontSize: "small"
+        }), /*#__PURE__*/_jsx(Typography, {
+          variant: "body2",
+          children: t("ai_learn_more")
+        }), /*#__PURE__*/_jsx(EastIcon, {
+          sx: {
+            ml: 0.5
+          },
+          fontSize: "small"
+        })]
+      })]
+    }), /*#__PURE__*/_jsxs(Grid, {
+      size: 12,
+      children: [/*#__PURE__*/_jsx(AISwitch, {
+        ...switchProps,
+        name: AI_FIELDS.all,
+        label: "limit_ai",
+        description: "limit_ai_desc",
+        info: "limit_ai_info",
+        value: classroomAIValue(values),
+        disabled: isAllLocked,
+        dataCy: "ai"
+      }), isAllLocked && /*#__PURE__*/_jsx(Alert, {
+        severity: "info",
+        "data-cy": "ai-locked-notice",
+        sx: {
+          mt: 1
+        },
+        children: t("ai_locked_notice")
+      }), !isAllLocked && isAllLimited && /*#__PURE__*/_jsx(Alert, {
+        severity: "info",
+        "data-cy": "ai-limited-notice",
+        sx: {
+          mt: 1
+        },
+        children: t("ai_limited_classroom_notice")
+      })]
+    }), /*#__PURE__*/_jsx(Grid, {
+      size: 12,
+      children: /*#__PURE__*/_jsxs(Box, {
+        sx: {
+          pl: 4,
+          display: "grid",
+          gap: 2
+        },
+        children: [/*#__PURE__*/_jsxs(Box, {
+          children: [/*#__PURE__*/_jsx(AISwitch, {
+            ...switchProps,
+            name: AI_FIELDS.chatbot,
+            label: "chatbot_ai",
+            description: "chatbot_ai_desc",
+            info: "dynamic_responses_info",
+            value: featureValue(AI_FIELDS.chatbot),
+            disabled: isAllLimited || Boolean(aiLockedBy(classroom, AI_FIELDS.chatbot)),
+            dataCy: "chatbot-ai"
+          }), !isAllLocked && Boolean(aiLockedBy(classroom, AI_FIELDS.chatbot)) && /*#__PURE__*/_jsx(Alert, {
+            severity: "info",
+            "data-cy": "ai-partly-locked-notice",
+            sx: {
+              mt: 1
+            },
+            children: t("ai_partly_locked_notice")
+          }), !isChatbotLimited && overriddenCourses.length > 0 && /*#__PURE__*/_jsxs(Alert, {
+            severity: "info",
+            "data-cy": "ai-course-overrides-notice",
+            sx: {
+              mt: 1
+            },
+            children: [t("ai_course_overrides_notice"), ": ", overriddenCourses.map(course => course.courseName).join(", ")]
+          })]
+        }), /*#__PURE__*/_jsxs(Box, {
+          children: [/*#__PURE__*/_jsx(AISwitch, {
+            ...switchProps,
+            name: AI_FIELDS.discuss,
+            label: "discuss_ai",
+            description: "discuss_ai_desc",
+            value: featureValue(AI_FIELDS.discuss),
+            disabled: isAllLimited || Boolean(aiLockedBy(classroom, AI_FIELDS.discuss)),
+            dataCy: "discuss-ai"
+          }), !isAllLocked && Boolean(aiLockedBy(classroom, AI_FIELDS.discuss)) && /*#__PURE__*/_jsx(Alert, {
+            severity: "info",
+            "data-cy": "ai-partly-locked-notice",
+            sx: {
+              mt: 1
+            },
+            children: t("ai_partly_locked_notice")
+          })]
+        })]
+      })
+    })]
+  });
+}
+AISettings.propTypes = {};
+AISettings.label = "ai_settings";
+AISettings.validationSchema = Yup.object().shape({
+  isAIEnabled: Yup.string(),
+  isDynamicResponsesEnabled: Yup.string(),
+  isDiscussAIFeedbackEnabled: Yup.string()
+});
+export default AISettings;

package/dist/Forms/CreateClassroom/Steps/AISettings/AISettings.test.js

@@ -0,0 +1,237 @@
+import { render, fireEvent, within } from "@testing-library/react";
+import { describe, it, expect, vi } from "vitest";
+import { createTheme, ThemeProvider } from "@mui/material/styles";
+import AISettings, { AI_INFO_URL } from "./AISettings";
+
+// This repo has no jest-dom matchers and no auto-cleanup, so assertions are
+// plain and each test unmounts - matching UpdateClassroom.test.jsx.
+import { jsx as _jsx } from "react/jsx-runtime";
+const courses = [{
+  courseId: "c1",
+  courseName: "Spanish 1"
+}, {
+  courseId: "c2",
+  courseName: "Spanish 2"
+}];
+const setup = (props = {}) => {
+  const utils = render(/*#__PURE__*/_jsx(ThemeProvider, {
+    theme: createTheme(),
+    children: /*#__PURE__*/_jsx(AISettings, {
+      values: {},
+      courses: courses,
+      courseSettings: {},
+      handleChange: () => {},
+      ...props
+    })
+  }));
+  // One radio group per switch, named after its field.
+  const group = name => within(utils.getByRole("radiogroup", {
+    name
+  }));
+  const radio = (name, label) => group(name).getByLabelText(label);
+  return {
+    ...utils,
+    radio
+  };
+};
+const SWITCHES = ["isAIEnabled", "isDynamicResponsesEnabled", "isDiscussAIFeedbackEnabled"];
+describe("AISettings", () => {
+  it("renders all three switches, allowed by default", () => {
+    const {
+      radio,
+      unmount
+    } = setup();
+    SWITCHES.forEach(name => {
+      expect(radio(name, "ai_allowed").checked).toBe(true);
+      expect(radio(name, "ai_allowed").disabled).toBe(false);
+    });
+    unmount();
+  });
+  it("shows both features as limited and fixed while all AI is limited", () => {
+    const {
+      radio,
+      queryByText,
+      unmount
+    } = setup({
+      values: {
+        isAIEnabled: "disabled",
+        isDynamicResponsesEnabled: "enabled",
+        isDiscussAIFeedbackEnabled: "enabled"
+      }
+    });
+    expect(radio("isAIEnabled", "ai_limited").checked).toBe(true);
+    ["isDynamicResponsesEnabled", "isDiscussAIFeedbackEnabled"].forEach(name => {
+      expect(radio(name, "ai_limited").checked).toBe(true);
+      expect(radio(name, "ai_allowed").disabled).toBe(true);
+    });
+    expect(queryByText("ai_limited_classroom_notice")).not.toBe(null);
+    unmount();
+  });
+  it("limits one feature on its own", () => {
+    const {
+      radio,
+      queryByText,
+      unmount
+    } = setup({
+      values: {
+        isDynamicResponsesEnabled: "disabled"
+      }
+    });
+    expect(radio("isAIEnabled", "ai_allowed").checked).toBe(true);
+    expect(radio("isDynamicResponsesEnabled", "ai_limited").checked).toBe(true);
+    expect(radio("isDiscussAIFeedbackEnabled", "ai_allowed").checked).toBe(true);
+    expect(queryByText("ai_limited_classroom_notice")).toBe(null);
+    unmount();
+  });
+  it("reports changes through handleChange so Formik owns the value", () => {
+    const handleChange = vi.fn();
+    const {
+      radio,
+      unmount
+    } = setup({
+      handleChange
+    });
+    fireEvent.click(radio("isDiscussAIFeedbackEnabled", "ai_limited"));
+    expect(handleChange).toHaveBeenCalled();
+    unmount();
+  });
+  it("names the courses that have limited their chatbot", () => {
+    const {
+      getByText,
+      unmount
+    } = setup({
+      courseSettings: {
+        c1: {
+          isDynamicResponsesEnabled: "disabled"
+        },
+        c2: {
+          isDynamicResponsesEnabled: "default"
+        }
+      }
+    });
+    const notice = getByText(/ai_course_overrides_notice/);
+    expect(notice.textContent).toContain("Spanish 1");
+    expect(notice.textContent).not.toContain("Spanish 2");
+    unmount();
+  });
+  it("hides the course overrides once the classroom's chatbot is limited", () => {
+    // The classroom already covers every course, so listing overrides would
+    // imply they still make a difference.
+    [{
+      isAIEnabled: "disabled"
+    }, {
+      isDynamicResponsesEnabled: "disabled"
+    }].forEach(values => {
+      const {
+        queryByText,
+        unmount
+      } = setup({
+        values,
+        courseSettings: {
+          c1: {
+            isDynamicResponsesEnabled: "disabled"
+          }
+        }
+      });
+      expect(queryByText(/ai_course_overrides_notice/)).toBe(null);
+      unmount();
+    });
+  });
+  it("links out to the same AI explainer the notice points at", () => {
+    const {
+      getByText,
+      unmount
+    } = setup();
+    expect(getByText("ai_learn_more").closest("a").getAttribute("href")).toBe(AI_INFO_URL);
+    unmount();
+  });
+  it("locks every switch when the customer has switched all AI off", () => {
+    const {
+      radio,
+      queryByText,
+      unmount
+    } = setup({
+      values: {
+        isAIEnabled: "disabled"
+      },
+      classroom: {
+        aiLockedBy: {
+          isAIEnabled: "customer"
+        }
+      }
+    });
+    SWITCHES.forEach(name => {
+      expect(radio(name, "ai_allowed").disabled).toBe(true);
+      expect(radio(name, "ai_limited").disabled).toBe(true);
+    });
+    expect(queryByText("ai_locked_notice")).not.toBe(null);
+    // One notice that says who did it, not a second implying the teacher did.
+    expect(queryByText("ai_limited_classroom_notice")).toBe(null);
+    unmount();
+  });
+  it("locks only the feature the customer has limited", () => {
+    const {
+      radio,
+      queryByText,
+      unmount
+    } = setup({
+      values: {
+        isDiscussAIFeedbackEnabled: "disabled"
+      },
+      classroom: {
+        aiLockedBy: {
+          isDiscussAIFeedbackEnabled: "customer"
+        }
+      }
+    });
+    expect(radio("isDiscussAIFeedbackEnabled", "ai_allowed").disabled).toBe(true);
+    expect(radio("isDynamicResponsesEnabled", "ai_allowed").disabled).toBe(false);
+    expect(radio("isAIEnabled", "ai_allowed").disabled).toBe(false);
+    expect(queryByText("ai_partly_locked_notice")).not.toBe(null);
+    expect(queryByText("ai_locked_notice")).toBe(null);
+    unmount();
+  });
+  it("reads the older single-level lock as a full lock", () => {
+    const {
+      radio,
+      queryByText,
+      unmount
+    } = setup({
+      classroom: {
+        aiLockedBy: "customer"
+      }
+    });
+    expect(radio("isDynamicResponsesEnabled", "ai_allowed").disabled).toBe(true);
+    expect(queryByText("ai_locked_notice")).not.toBe(null);
+    unmount();
+  });
+  it("leaves every switch editable when nothing above the classroom has locked it", () => {
+    const {
+      radio,
+      queryByText,
+      unmount
+    } = setup({
+      classroom: {}
+    });
+    SWITCHES.forEach(name => {
+      expect(radio(name, "ai_allowed").disabled).toBe(false);
+    });
+    expect(queryByText("ai_locked_notice")).toBe(null);
+    expect(queryByText("ai_partly_locked_notice")).toBe(null);
+    unmount();
+  });
+  it("scrolls itself into view when the AI notice sends a teacher here", () => {
+    const scrollIntoView = vi.fn();
+    window.HTMLElement.prototype.scrollIntoView = scrollIntoView;
+    const setScrollToDynamicResponses = vi.fn();
+    const {
+      unmount
+    } = setup({
+      scrollToDynamicResponses: true,
+      setScrollToDynamicResponses
+    });
+    expect(scrollIntoView).toHaveBeenCalled();
+    expect(setScrollToDynamicResponses).toHaveBeenCalledWith(false);
+    unmount();
+  });
+});

package/dist/Forms/CreateClassroom/Steps/ClassroomSettings/ClassroomSettings.js

@@ -1,11 +1,10 @@
 import { useRef, useEffect } from "react";
-import { Grid, FormControl, FormControlLabel, FormLabel, Radio, RadioGroup, Typography, TextField, IconButton } from "@mui/material";
+import { Grid, FormControl, FormControlLabel, FormLabel, Radio, RadioGroup, Typography, TextField } from "@mui/material";
 import * as Yup from "yup";
 import Tooltip from "@mui/material/Tooltip";
 import ChipInput from "../../../../Forms/ChipInput/ChipInput";
 import { domainPattern } from "../../../../utils/index";
 import { containsInvalidSymbols, containsInvalidCollaboratorSymbols } from "../../../../utils/index";
-import HelpIcon from "@mui/icons-material/Help";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 function ClassroomSettings({
   t,
@@ -19,8 +18,6 @@ function ClassroomSettings({
   isUpdateClassroom = false,
   scrollToDiscuss = false,
   setScrollToDiscuss,
-  scrollToDynamicResponses = false,
-  setScrollToDynamicResponses,
   isVideoChatEnabled,
   collaboratorLabels
 }) {
@@ -29,11 +26,9 @@ function ClassroomSettings({
     enrolmentKey,
     allowedDomains,
     collaborators,
-    vchatEnabledInSettings,
-    isDynamicResponsesEnabled
+    vchatEnabledInSettings
   } = values;
   const vchatEnabledInSettingsRef = useRef(null);
-  const dynamicResponsesRef = useRef(null);
   const generateRandomEnrolmentKey = () => {
     return String(Math.floor(Math.random() * 90000) + 10000);
   };
@@ -54,15 +49,6 @@ function ClassroomSettings({
       setScrollToDiscuss(false);
     }
   }, [scrollToDiscuss]);
-  useEffect(() => {
-    if (scrollToDynamicResponses) {
-      dynamicResponsesRef.current.scrollIntoView({
-        behavior: "smooth",
-        block: "center"
-      });
-      setScrollToDynamicResponses(false);
-    }
-  }, [scrollToDynamicResponses]);
   const isInviteFeatureDisabled = classroomId && classroomId.toLowerCase().includes("wayside");
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(Typography, {
@@ -279,54 +265,6 @@ function ClassroomSettings({
             })]
           })]
         })
-      }), /*#__PURE__*/_jsx(Grid, {
-        ref: dynamicResponsesRef,
-        size: {
-          xs: 12,
-          md: 12
-        },
-        children: /*#__PURE__*/_jsxs(FormControl, {
-          component: "fieldset",
-          children: [/*#__PURE__*/_jsxs(FormLabel, {
-            component: "legend",
-            children: [t("dynamic_response"), /*#__PURE__*/_jsx(Tooltip, {
-              title: t("dynamic_responses_info"),
-              placement: "right",
-              children: /*#__PURE__*/_jsx(IconButton, {
-                sx: {
-                  padding: 0,
-                  marginLeft: 1
-                },
-                children: /*#__PURE__*/_jsx(HelpIcon, {
-                  fontSize: "small"
-                })
-              })
-            })]
-          }), /*#__PURE__*/_jsx(Typography, {
-            color: "textSecondary",
-            children: t("dynamic_response_desc")
-          }), /*#__PURE__*/_jsxs(RadioGroup, {
-            row: true,
-            "aria-label": "isDynamicResponsesEnabled",
-            name: "isDynamicResponsesEnabled",
-            value: isDynamicResponsesEnabled || "enabled",
-            onChange: handleChange,
-            onBlur: handleBlur,
-            helperText: touched.isDynamicResponsesEnabled ? errors.isDynamicResponsesEnabled : "",
-            error: touched.isDynamicResponsesEnabled && Boolean(errors.isDynamicResponsesEnabled),
-            children: [/*#__PURE__*/_jsx(FormControlLabel, {
-              value: "enabled",
-              control: /*#__PURE__*/_jsx(Radio, {}),
-              label: t("enabled"),
-              "data-cy": "enable-dynamic-responses-in-settings"
-            }), /*#__PURE__*/_jsx(FormControlLabel, {
-              value: "disabled",
-              control: /*#__PURE__*/_jsx(Radio, {}),
-              label: t("disabled"),
-              "data-cy": "disable-dynamic-responses-in-settings"
-            })]
-          })]
-        })
       })]
     }), /*#__PURE__*/_jsx("br", {}), /*#__PURE__*/_jsx(Typography, {
       children: t("add_collaborators")

package/dist/Forms/CreateClassroom/Steps/CourseSettings/CourseSettings.js

@@ -3,6 +3,7 @@ import { Grid, FormControl, List, ListItem, ListItemButton, ListItemText, Box, A
 import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
 import ExpandLessIcon from "@mui/icons-material/ExpandLess";
 import HelpIcon from "@mui/icons-material/Help";
+import { AI_DEFAULT, AI_DISABLED, courseAIValue, isClassroomChatbotAIEnabled } from "../../../../utils/aiControls";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 function Settings({
   t,
@@ -12,11 +13,13 @@ function Settings({
   handleBlur,
   courseId,
   setFieldValue,
-  classroomIsDynamicResponsesEnabled
+  classroomAISettings
 }) {
   const {
     courseSettings
   } = values;
+  // Courses only hold chatbots, so this per-course switch is the chatbot one.
+  const classroomAIAllowed = isClassroomChatbotAIEnabled(classroomAISettings);
   const thisCoursesSettings = courseSettings && courseId in courseSettings ? courseSettings[courseId] : {};
   return /*#__PURE__*/_jsxs(Grid, {
     container: true,
@@ -180,7 +183,7 @@ function Settings({
         component: "fieldset",
         children: [/*#__PURE__*/_jsxs(FormLabel, {
           component: "legend",
-          children: [t("dynamic_response"), /*#__PURE__*/_jsx(Tooltip, {
+          children: [t("chatbot_ai"), /*#__PURE__*/_jsx(Tooltip, {
             title: t("dynamic_responses_info"),
             placement: "right",
             children: /*#__PURE__*/_jsx(IconButton, {
@@ -195,12 +198,12 @@ function Settings({
           })]
         }), /*#__PURE__*/_jsx(Typography, {
           color: "textSecondary",
-          children: t("dynamic_response_desc")
+          children: t("limit_ai_course_desc")
         }), /*#__PURE__*/_jsxs(RadioGroup, {
           row: true,
-          "aria-label": "Dynamic Responses",
+          "aria-label": "Limit AI",
           name: `courseSettings.${courseId}.isDynamicResponsesEnabled`,
-          value: classroomIsDynamicResponsesEnabled === "disabled" ? "disabled" : thisCoursesSettings.isDynamicResponsesEnabled || "default",
+          value: classroomAIAllowed ? courseAIValue(thisCoursesSettings) : AI_DISABLED,
           onChange: event => {
             const newCourseSettings = {
               ...courseSettings,
@@ -215,14 +218,14 @@ function Settings({
           helperText: touched.visibility ? errors.visibility : "",
           error: touched.visibility && Boolean(errors.visibility),
           children: [/*#__PURE__*/_jsx(FormControlLabel, {
-            value: "default",
+            value: AI_DEFAULT,
             control: /*#__PURE__*/_jsx(Radio, {}),
             label: t("course_default"),
-            disabled: classroomIsDynamicResponsesEnabled === "disabled"
+            disabled: !classroomAIAllowed
           }), /*#__PURE__*/_jsx(FormControlLabel, {
-            value: "disabled",
+            value: AI_DISABLED,
             control: /*#__PURE__*/_jsx(Radio, {}),
-            label: t("disabled")
+            label: t("ai_limited")
           })]
         })]
       })
@@ -239,7 +242,7 @@ function Course({
   handleChange,
   handleBlur,
   setFieldValue,
-  classroomIsDynamicResponsesEnabled
+  classroomAISettings
 }) {
   const [open, setOpen] = useState(false);
   return /*#__PURE__*/_jsxs(List, {
@@ -298,7 +301,7 @@ function Course({
           handleBlur: handleBlur,
           courseId: course.courseId,
           setFieldValue: setFieldValue,
-          classroomIsDynamicResponsesEnabled: classroomIsDynamicResponsesEnabled
+          classroomAISettings: classroomAISettings
         })
       })
     })]
@@ -313,7 +316,7 @@ function CourseSettings({
   handleChange,
   handleBlur,
   setFieldValue,
-  classroomIsDynamicResponsesEnabled
+  classroomAISettings
 }) {
   return /*#__PURE__*/_jsx(_Fragment, {
     children: courses.length > 0 ? /*#__PURE__*/_jsxs(_Fragment, {
@@ -329,7 +332,7 @@ function CourseSettings({
         handleChange: handleChange,
         handleBlur: handleBlur,
         setFieldValue: setFieldValue,
-        classroomIsDynamicResponsesEnabled: classroomIsDynamicResponsesEnabled
+        classroomAISettings: classroomAISettings
       }))]
     }) : /*#__PURE__*/_jsx(Typography, {
       children: t("classroom_courses_not_found_desc")

package/dist/Forms/CreateClassroom/Steps/index.js

@@ -1,6 +1,7 @@
+import AISettings from "./AISettings/AISettings";
 import ClassroomInformation from "./ClassroomInformation/ClassroomInformation";
 import ClassroomSettings from "./ClassroomSettings/ClassroomSettings";
 import Customization from "./Customization/Customization";
 import Confirmation from "./Confirmation/Confirmation";
 import CourseSettings from "./CourseSettings/CourseSettings";
-export { ClassroomInformation, ClassroomSettings, Customization, Confirmation, CourseSettings };
+export { AISettings, ClassroomInformation, ClassroomSettings, Customization, Confirmation, CourseSettings };

package/dist/Forms/UpdateClassroom/UpdateClassroom.js

@@ -2,7 +2,8 @@ import { useEffect, useRef } from "react";
 import { Divider, Button, Grid, Card, CardActions, CardContent, CardHeader, Typography } from "@mui/material";
 import { makeStyles } from "tss-react/mui";
 import { Formik } from "formik";
-import { ClassroomInformation, ClassroomSettings, Customization, CourseSettings } from "../CreateClassroom/Steps";
+import { AISettings, ClassroomInformation, ClassroomSettings, Customization, CourseSettings } from "../CreateClassroom/Steps";
+import { AI_DEFAULT, AI_FIELDS, aiLockedBy, classroomAIFields, classroomAIValue } from "../../utils/aiControls";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useStyles = makeStyles()(theme => ({
   padding: {
@@ -70,9 +71,15 @@ export default function UpdateClassroom({
     bannerBuilderColor,
     bannerBuilderIcon,
     tags,
-    courseSettings,
-    isDynamicResponsesEnabled
+    courseSettings
   } = initialValues;
+
+  // The classroom's AI switches as saved: all AI, chatbot and Discuss.
+  const aiValues = Object.fromEntries(Object.values(AI_FIELDS).map(field => [field, classroomAIValue(initialValues, field)]));
+
+  // Set by the API when the classroom's customer has switched all AI off.
+  // Nothing saved here could change that, so the section is read-only.
+  const isAILocked = Boolean(aiLockedBy(initialValues));
   const courseIds = courses.map(course => course.courseId);
   let validatedCourseSettings;
   if (courseSettings === undefined) {
@@ -82,7 +89,7 @@ export default function UpdateClassroom({
         translationEnabled: "default",
         wordBankEnabled: "default",
         shuffleEnabled: "default",
-        isDynamicResponsesEnabled: "default"
+        isDynamicResponsesEnabled: AI_DEFAULT
       };
       return obj;
     }, {});
@@ -97,7 +104,7 @@ export default function UpdateClassroom({
           translationEnabled: "default",
           wordBankEnabled: "default",
           shuffleEnabled: "default",
-          isDynamicResponsesEnabled: "default"
+          isDynamicResponsesEnabled: AI_DEFAULT
         };
       }
     });
@@ -185,8 +192,7 @@ export default function UpdateClassroom({
         allowedDomains,
         collaborators,
         vchatEnabled,
-        vchatEnabledInSettings,
-        isDynamicResponsesEnabled
+        vchatEnabledInSettings
       },
       enableReinitialize: enableReinitialize,
       validationSchema: ClassroomSettings.validationSchema,
@@ -231,8 +237,6 @@ export default function UpdateClassroom({
                   values: values,
                   scrollToDiscuss: scrollToDiscuss,
                   setScrollToDiscuss: setScrollToDiscuss,
-                  scrollToDynamicResponses: scrollToDynamicResponses,
-                  setScrollToDynamicResponses: setScrollToDynamicResponses,
                   isVideoChatEnabled: isVideoChatEnabled,
                   collaboratorLabels: collaboratorLabels,
                   ...otherProps
@@ -252,6 +256,67 @@ export default function UpdateClassroom({
           })
         })
       })
+    }), /*#__PURE__*/_jsx("br", {}), /*#__PURE__*/_jsx(Formik, {
+      initialValues: aiValues,
+      enableReinitialize: enableReinitialize,
+      validationSchema: AISettings.validationSchema
+      // Switches the customer has locked are left out, so the API's
+      // override is never saved over the teacher's own choice.
+      ,
+      onSubmit: (values, actions) => onSubmit(classroomAIFields(values, initialValues), actions),
+      render: ({
+        handleChange,
+        handleSubmit,
+        isSubmitting,
+        dirty,
+        values,
+        ...otherProps
+      }) => /*#__PURE__*/_jsx("form", {
+        onSubmit: handleSubmit,
+        children: /*#__PURE__*/_jsx(Grid, {
+          container: true,
+          sx: {
+            width: "100%"
+          },
+          spacing: 1,
+          children: /*#__PURE__*/_jsx(Grid, {
+            size: 12,
+            children: /*#__PURE__*/_jsxs(Card, {
+              children: [/*#__PURE__*/_jsx(CardHeader, {
+                title: /*#__PURE__*/_jsx(Typography, {
+                  variant: "h5",
+                  component: "h2",
+                  children: t(AISettings.label)
+                }),
+                className: classes.padding
+              }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(CardContent, {
+                className: classes.formContent,
+                children: /*#__PURE__*/_jsx(AISettings, {
+                  t: t,
+                  values: values,
+                  handleChange: handleChange,
+                  courses: courses,
+                  courseSettings: validatedCourseSettings,
+                  classroom: initialValues,
+                  scrollToDynamicResponses: scrollToDynamicResponses,
+                  setScrollToDynamicResponses: setScrollToDynamicResponses,
+                  ...otherProps
+                })
+              }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(CardActions, {
+                className: classes.padding,
+                children: /*#__PURE__*/_jsx(Button, {
+                  type: "submit",
+                  color: "primary",
+                  variant: "contained",
+                  disabled: isSubmitting || !dirty || isClassroomArchived || isAILocked,
+                  "data-cy": "save-ai-settings",
+                  children: t("save_changes")
+                })
+              })]
+            })
+          })
+        })
+      })
     }), /*#__PURE__*/_jsx("br", {}), /*#__PURE__*/_jsx(Formik, {
       initialValues: {
         picture,
@@ -362,7 +427,7 @@ export default function UpdateClassroom({
                   values: values,
                   handleChange: handleChange,
                   setFieldValue: setFieldValue,
-                  classroomIsDynamicResponsesEnabled: isDynamicResponsesEnabled,
+                  classroomAISettings: initialValues,
                   ...otherProps
                 })
               }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(CardActions, {

package/dist/Tables/MeetingPrompstList/MeetingPromptsList.js

@@ -35,6 +35,9 @@ const MeetingPromptsList = withStyles(({
   handleCreateFeedback,
   handleBatchGradeConversations,
   aiGrade,
+  // Discuss AI feedback, already combined with the all-AI switch, so the
+  // generate controls below come down when either is off.
+  isDiscussAIFeedbackEnabled = true,
   meetingRecsData,
   resetVideoState,
   setSelectedRecording,
@@ -490,6 +493,7 @@ const MeetingPromptsList = withStyles(({
       t: t,
       handleBatchGradeConversations: handleBatchGradeConversations,
       aiGrade: aiGrade,
+      isDiscussAIFeedbackEnabled: isDiscussAIFeedbackEnabled,
       selectedGroup: selectedGroup,
       setSelectedRecording: setSelectedRecording,
       selectedRecording: selectedRecording,

package/dist/hooks/useExerciseState.js

@@ -1485,7 +1485,7 @@ export default function useExerciseState({
     setIsWordBankAttemptChanged(false);
   };
   const formatBotMessages = async botMessages => {
-    const updatedConversationHistory = conversationHistory.slice(1);
+    const updatedConversationHistory = (conversationHistory || []).slice(1);
     const responses = await Promise.all(botMessages.map(async m => {
       let conversationHistoryMessage = updatedConversationHistory.find(historyMsg => historyMsg.content?.trim() === m.text?.trim());
       const updatedMessage = {
@@ -1719,7 +1719,7 @@ export default function useExerciseState({
         if (response && response.reply) {
           setBotText("");
           setBotVars(response.vars);
-          setConversationHistory(response.conversationHistory);
+          setConversationHistory(response.conversationHistory || []);
           handleReset();
           if (clearAttemptAudio) {
             clearAttemptAudio();

package/dist/utils/aiControls.js

@@ -0,0 +1,63 @@
+// The classroom's AI switches: one for all AI, and one each for chatbot
+// dynamic responses and Discuss AI feedback. A feature is on only when the
+// all-AI switch and its own switch are both on. Everything downstream asks
+// these helpers rather than reading a field directly.
+//
+// Each field is "enabled" or "disabled", and an absent value means on -
+// classrooms predate the controls. `isDynamicResponsesEnabled` is the original
+// chatbot field, so classrooms saved before the other two keep their setting.
+
+export const AI_ENABLED = "enabled";
+export const AI_DISABLED = "disabled";
+export const AI_DEFAULT = "default";
+export const AI_FIELDS = {
+  all: "isAIEnabled",
+  chatbot: "isDynamicResponsesEnabled",
+  discuss: "isDiscussAIFeedbackEnabled"
+};
+const read = (record, field) => record && typeof record === "object" ? record[field] : undefined;
+
+// Anything other than an explicit "disabled" counts as on, so an unset or
+// unrecognised value never silently turns AI off.
+const isOn = value => value !== AI_DISABLED;
+
+// Courses only hold the chatbot switch, so this is the one field to read.
+const readCourse = courseSettings => read(courseSettings, AI_FIELDS.chatbot);
+
+// The all-AI switch on its own.
+export const isClassroomAIEnabled = classroom => isOn(read(classroom, AI_FIELDS.all));
+export const isClassroomChatbotAIEnabled = classroom => isClassroomAIEnabled(classroom) && isOn(read(classroom, AI_FIELDS.chatbot));
+export const isClassroomDiscussAIFeedbackEnabled = classroom => isClassroomAIEnabled(classroom) && isOn(read(classroom, AI_FIELDS.discuss));
+
+// Chatbot dynamic responses for one course in the classroom. A course can only
+// narrow the classroom's answer, never re-enable it.
+export const isCourseAIEnabled = (classroom, courseSettings) => isClassroomChatbotAIEnabled(classroom) && readCourse(courseSettings) !== AI_DISABLED;
+
+// The value a classroom radio should show for one of AI_FIELDS.
+export const classroomAIValue = (classroom, field = AI_FIELDS.all) => read(classroom, field) || AI_ENABLED;
+
+// The value a per-course radio should show.
+export const courseAIValue = courseSettings => readCourse(courseSettings) || AI_DEFAULT;
+
+// Which level above the classroom has locked a switch, if any. The API sets
+// `aiLockedBy` per field; a lock on all AI locks every switch. An older API
+// sent one level for everything, which is still read as a full lock.
+export const aiLockedBy = (classroom, field = AI_FIELDS.all) => {
+  const locks = read(classroom, "aiLockedBy");
+  if (!locks) return null;
+  if (typeof locks === "string") return locks;
+  return locks[field] || locks[AI_FIELDS.all] || null;
+};
+
+// The switches to save: only the ones the teacher changed, so a switch still
+// on the customer's default keeps following it. Locked ones are left out too:
+// their value is the API's override, and saving it would overwrite the
+// teacher's own choice.
+export const classroomAIFields = (values, classroom) => Object.values(AI_FIELDS).reduce((fields, field) => {
+  const value = classroomAIValue(values, field);
+  const isUnchanged = value === classroomAIValue(classroom, field);
+  return aiLockedBy(classroom, field) || isUnchanged ? fields : {
+    ...fields,
+    [field]: value
+  };
+}, {});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nualang/nualang-ui-components",
-  "version": "0.1.1435",
+  "version": "0.1.1436",
   "type": "module",
   "main": "dist/index.js",
   "files": [