LLM Frontend

src/commons/application/actions/__tests__/SessionActions.ts

@@ -231,6 +231,7 @@ test('setCourseConfiguration generates correct action object', () => {
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help text',
+    defaultLlmPrompt: 'defaul Llm Prompt',
     assessmentTypes: ['Missions', 'Quests', 'Paths', 'Contests', 'Others']
   };
   const action = setCourseConfiguration(courseConfig);
@@ -510,6 +511,7 @@ test('updateGradingOverviews generates correct action object', () => {
     {
       assessmentId: 1,
       assessmentName: 'test assessment',
+      questions: '',
       assessmentType: 'Contests',
       initialXp: 0,
       xpBonus: 100,
@@ -612,6 +614,7 @@ test('updateCourseConfig generates correct action object', () => {
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help text',
+    defaultLlmPrompt: 'default LLM Prompt',
     assessmentTypes: ['Missions', 'Quests', 'Paths', 'Contests', 'Others']
   };
   const action = updateCourseConfig(courseConfig);

src/commons/application/reducers/__tests__/SessionReducer.ts

@@ -99,6 +99,7 @@ test('SET_COURSE_CONFIGURATION works correctly', () => {
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help text',
+    defaultLlmPrompt: 'default LLM Prompt',
     assessmentTypes: ['Missions', 'Quests', 'Paths', 'Contests', 'Others']
   };
   const action = {
@@ -474,6 +475,7 @@ const gradingOverviewTest1: GradingOverview[] = [
   {
     assessmentId: 1,
     assessmentName: 'test assessment',
+    questions: '',
     assessmentType: 'Contests',
     initialXp: 0,
     xpBonus: 100,
@@ -495,6 +497,7 @@ const gradingOverviewTest2: GradingOverview[] = [
   {
     assessmentId: 2,
     assessmentName: 'another assessment',
+    questions: '',
     assessmentType: 'Quests',
     initialXp: 20,
     xpBonus: 250,

src/commons/application/types/SessionTypes.ts

@@ -51,6 +51,7 @@ export const UPDATE_TOTAL_XP = 'UPDATE_TOTAL_XP';
 export const UPDATE_ALL_USER_XP = 'UPDATE_ALL_USER_XP';
 export const UPDATE_ASSESSMENT = 'UPDATE_ASSESSMENT';
 export const UPDATE_GRADING_OVERVIEWS = 'UPDATE_GRADING_OVERVIEWS';
+export const UPDATE_GRADING_OVERVIEWS_TEST = 'UPDATE_GRADING_OVERVIEWS_TEST';
 export const UPDATE_GRADING = 'UPDATE_GRADING';
 export const FETCH_NOTIFICATIONS = 'FETCH_NOTIFICATIONS';
 export const ACKNOWLEDGE_NOTIFICATIONS = 'ACKNOWLEDGE_NOTIFICATIONS';
@@ -106,6 +107,7 @@ export type SessionState = {
   readonly sourceChapter?: number;
   readonly sourceVariant?: Variant;
   readonly moduleHelpText?: string;
+  readonly defaultLlmPrompt?: string;
   readonly assetsPrefix?: string;
 
   readonly assessmentConfigurations?: AssessmentConfiguration[];
@@ -171,6 +173,7 @@ export type CourseConfiguration = {
   sourceChapter: Chapter;
   sourceVariant: Variant;
   moduleHelpText: string;
+  defaultLlmPrompt: string;
   assetsPrefix: string;
 };
 

src/commons/dropdown/DropdownCreateCourse.tsx

@@ -40,7 +40,8 @@ const DropdownCreateCourse: React.FC<DialogProps> = props => {
     enableSourcecast: true,
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
-    moduleHelpText: ''
+    moduleHelpText: '',
+    defaultLlmPrompt: ''
   });
 
   const [courseHelpTextSelectedTab, setCourseHelpTextSelectedTab] =
@@ -173,6 +174,40 @@ const DropdownCreateCourse: React.FC<DialogProps> = props => {
           )}
         </FormGroup>
 
+        <FormGroup helperText="defaultLlmPrompt" labelFor="defaultLlmPrompt">
+          <Text tagName="span">Default LLM Prompt&nbsp;</Text>
+          <Text tagName="span" className="optional-text">
+            (optional)
+          </Text>
+          <Tabs
+            selectedTabId={courseHelpTextSelectedTab}
+            onChange={onChangeTabs}
+            className="module-help-text-tabs"
+          >
+            <Tab id={CourseHelpTextEditorTab.WRITE} title="Write" />
+            <Tab id={CourseHelpTextEditorTab.PREVIEW} title="Preview" />
+          </Tabs>
+          {courseHelpTextSelectedTab === CourseHelpTextEditorTab.WRITE && (
+            <TextArea
+              id="defaultLlmPrompt"
+              className="input-textarea"
+              fill={true}
+              value={courseConfig.defaultLlmPrompt}
+              onChange={e =>
+                setCourseConfig({
+                  ...courseConfig,
+                  defaultLlmPrompt: e.target.value
+                })
+              }
+            />
+          )}
+          {courseHelpTextSelectedTab === CourseHelpTextEditorTab.PREVIEW && (
+            <div className="input-markdown">
+              <Markdown content={courseConfig.defaultLlmPrompt || ''} openLinksInNewWindow />
+            </div>
+          )}
+        </FormGroup>
+
         <div className="boolean-container">
           <div>
             <Switch

src/commons/dropdown/DropdownPrompt.tsx

@@ -0,0 +1,46 @@
+import { Classes, Dialog } from '@blueprintjs/core';
+import { IconNames } from '@blueprintjs/icons';
+import * as React from 'react';
+
+import Markdown from '../Markdown';
+import { Links } from '../utils/Constants';
+import { useTypedSelector } from '../utils/Hooks';
+
+type DialogProps = {
+  isOpen: boolean;
+  onClose: () => void;
+};
+
+const DropdownPrompt: React.FC<DialogProps> = props => {
+  const defaultLlmPrompt = useTypedSelector(store => store.session.defaultLlmPrompt);
+
+  return (
+    <Dialog
+      className="help"
+      icon={IconNames.ERROR}
+      isCloseButtonShown={true}
+      isOpen={props.isOpen}
+      onClose={props.onClose}
+      title="Help"
+    >
+      <div className={Classes.DIALOG_BODY}>
+        {defaultLlmPrompt ? (
+          <Markdown content={defaultLlmPrompt} openLinksInNewWindow />
+        ) : (
+          <>
+            <p>
+              We recommend recent updates of the browsers <b>Google Chrome</b>,{' '}
+              <b>Microsoft Edge</b>, or <b>Mozilla Firefox</b> to visit the Source Academy.
+            </p>
+            <p>
+              If you encounter issues with the Source Academy using these browsers, please use the
+              issue system of the{' '}
+              <a href={Links.githubIssues}>Source Academy frontend repository on GitHub</a>.
+            </p>
+          </>
+        )}
+      </div>
+    </Dialog>
+  );
+};
+export default DropdownPrompt;

src/commons/mocks/GradingMocks.ts

@@ -11,6 +11,7 @@ export const mockGradingOverviews: GradingOverview[] = [
     assessmentType: 'Missions',
     assessmentId: 0,
     assessmentName: 'Mission 0 ',
+    questions: '',
     currentXp: 69,
     xpBonus: 10,
     initialXp: 69,
@@ -29,6 +30,7 @@ export const mockGradingOverviews: GradingOverview[] = [
     assessmentType: 'Missions',
     assessmentId: 1,
     assessmentName: 'Mission 1',
+    questions: '',
     currentXp: -2,
     xpBonus: 12,
     initialXp: 0,
@@ -47,6 +49,7 @@ export const mockGradingOverviews: GradingOverview[] = [
     assessmentType: 'Missions',
     assessmentId: 0,
     assessmentName: 'Mission 0',
+    questions: '',
     currentXp: 1000,
     xpBonus: 12,
     initialXp: 996,

src/commons/mocks/UserMocks.ts

@@ -133,6 +133,7 @@ export const mockCourseConfigurations: CourseConfiguration[] = [
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: '',
+    defaultLlmPrompt: '',
     assetsPrefix: ''
   },
   {
@@ -145,6 +146,7 @@ export const mockCourseConfigurations: CourseConfiguration[] = [
     sourceChapter: Chapter.SOURCE_2,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help Text!',
+    defaultLlmPrompt: 'Default LLM Prompt',
     assetsPrefix: ''
   }
 ];

src/commons/sagas/RequestsSaga.ts

@@ -623,6 +623,7 @@ export const getGradingOverviews = async (
         assessmentType: overview.assessment.type,
         studentId: overview.student.id,
         studentName: overview.student.name,
+        questions: overview.questions,
         submissionId: overview.id,
         submissionStatus: overview.status,
         groupName: overview.student.groupName,

src/commons/sagas/__tests__/BackendSaga.ts

@@ -176,6 +176,7 @@ const mockCourseConfiguration1: CourseConfiguration = {
   sourceChapter: Chapter.SOURCE_1,
   sourceVariant: Variant.DEFAULT,
   moduleHelpText: 'Help text',
+  defaultLlmPrompt: 'default LLM prompt',
   assetsPrefix: ''
 };
 
@@ -206,6 +207,7 @@ const mockCourseConfiguration2: CourseConfiguration = {
   sourceChapter: Chapter.SOURCE_4,
   sourceVariant: Variant.DEFAULT,
   moduleHelpText: 'Help text',
+  defaultLlmPrompt: 'default LLM prompt',
   assetsPrefix: ''
 };
 
@@ -889,6 +891,7 @@ describe('Test UPDATE_COURSE_CONFIG action', () => {
     sourceChapter: Chapter.SOURCE_4,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help',
+    defaultLlmPrompt: 'default LLM prompt',
     assetsPrefix: ''
   };
 
@@ -985,7 +988,8 @@ describe('Test CREATE_COURSE action', () => {
     enableSourcecast: true,
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
-    moduleHelpText: 'Help Text'
+    moduleHelpText: 'Help Text',
+    defaultLlmPrompt: 'default Llm prompt'
   };
   const user = mockUser;
   const courseConfiguration = mockCourseConfiguration1;

src/features/academy/__tests__/AcademyActions.ts

@@ -33,7 +33,8 @@ test('createCourse generates correct action object', () => {
     enableSourcecast: true,
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
-    moduleHelpText: 'Help Text'
+    moduleHelpText: 'Help Text',
+    defaultLlmPrompt: 'default LLM prompt'
   };
 
   const action = createCourse(courseConfig);

src/features/grading/GradingTypes.ts

@@ -25,6 +25,7 @@ export type GradingOverview = {
   studentName: string;
   submissionId: number;
   submissionStatus: string;
+  questions: string;
   groupName: string;
   groupLeaderId?: number;
   gradingStatus: GradingStatus;

src/pages/__tests__/localStorage.test.ts

@@ -20,6 +20,7 @@ const mockShortDefaultState: SavedState = {
     enableAchievements: defaultState.session.enableAchievements,
     enableSourcecast: defaultState.session.enableSourcecast,
     moduleHelpText: defaultState.session.moduleHelpText,
+    defaultLlmPrompt: defaultState.session.defaultLlmPrompt,
     assetsPrefix: defaultState.session.assetsPrefix,
     assessmentConfigurations: defaultState.session.assessmentConfigurations
   },

src/pages/academy/adminPanel/AdminPanel.tsx

@@ -45,7 +45,8 @@ const AdminPanel: React.FC = () => {
     enableGame: true,
     enableAchievements: true,
     enableSourcecast: true,
-    moduleHelpText: ''
+    moduleHelpText: '',
+    defaultLlmPrompt: ''
   });
 
   const dispatch = useDispatch();
@@ -84,7 +85,8 @@ const AdminPanel: React.FC = () => {
       enableGame: session.enableGame,
       enableAchievements: session.enableAchievements,
       enableSourcecast: session.enableSourcecast,
-      moduleHelpText: session.moduleHelpText
+      moduleHelpText: session.moduleHelpText,
+      defaultLlmPrompt: session.defaultLlmPrompt
     });
 
     // IMPT: To prevent mutation of props