@nualang/nualang-ui-components 0.1.1323 → 0.1.1327

package/dist/Assignments/CreateAssignmentDialog/CreateAssignmentDialog.js

@@ -73,6 +73,7 @@ export default function CreateAssignmentDialog({
     exercises: submittedExercises
   });
   const [isTitleEdited, setIsTitleEdited] = useState(Boolean(initialData.title));
+  const [isCreating, setIsCreating] = useState(false);
   const classroomQuery = useQueries({
     queries: (Array.isArray(assignment.classroomId) ? assignment.classroomId : [assignment.classroomId]).map(cId => ({
       queryKey: classroomQuerys.classroomKeys.item(cId, username),
@@ -262,6 +263,7 @@ export default function CreateAssignmentDialog({
     }));
   };
   const handleCreateAssignment = async () => {
+    setIsCreating(true);
     try {
       await Promise.all(assignment.classroomId.map(async cId => {
         const selectedClassroomMembers = uniqueClassroomMembers.filter(member => member.classroomId === cId).map(student => student.memberId).filter(studentId => assignment?.assignedStudents.includes(studentId));
@@ -275,6 +277,8 @@ export default function CreateAssignmentDialog({
       handleClose();
     } catch (error) {
       console.error("Error creating assignments:", error);
+    } finally {
+      setIsCreating(false);
     }
   };
   const handleRemoveExercise = toRemove => {
@@ -647,7 +651,7 @@ export default function CreateAssignmentDialog({
         },
         children: /*#__PURE__*/_jsx(Button, {
           "data-cy": "assignment-assign-button",
-          disabled: !assignment.assignedStudents?.length || !assignment.scheduleDate || !assignment.dueDate || !assignment.title || !assignment.classroomId || !assignment.exercises?.length,
+          disabled: isCreating || !assignment.assignedStudents?.length || !assignment.scheduleDate || !assignment.dueDate || !assignment.title || !assignment.classroomId || !assignment.exercises?.length,
           onClick: async () => await handleCreateAssignment(),
           children: t("assign")
         })

package/dist/Cards/CardElements/CardTitle/CardTitle.js

@@ -6,7 +6,7 @@ const StyledCardTitle = styled(Typography)(({
   theme
 }) => ({
   fontSize: "1.125rem",
-  fontWeight: "bold",
+  fontWeight: "600",
   marginTop: theme.spacing(2)
 }));
 function CardTitle({

package/dist/Cards/CardElements/index.js

@@ -9,7 +9,6 @@ const CardContainer = styled(Card)(({
   theme
 }) => ({
   textAlign: "left",
-  color: theme.palette.text.secondary,
   maxWidth: 600,
   minWidth: 320,
   display: "flex",
@@ -109,7 +108,8 @@ const CardInfoSection = styled(Box)(({
   [theme.breakpoints.down("sm")]: {
     marginBottom: 0
   },
-  marginBottom: theme.spacing(2)
+  marginBottom: theme.spacing(2),
+  color: theme.palette.text.secondary
 }));
 const CardInfoSectionItem = styled(Typography)(() => ({
   display: "flex",

package/dist/Cards/FeedbackCard/FeedbackCard.js

@@ -13,7 +13,6 @@ import level2Rubric from "../../Dialogs/PDFViewer/rubrics/level2Rubric.pdf";
 import level3Rubric from "../../Dialogs/PDFViewer/rubrics/level3Rubric.pdf";
 import level4Rubric from "../../Dialogs/PDFViewer/rubrics/level4Rubric.pdf";
 import HelpOutlineIcon from "@mui/icons-material/HelpOutline";
-import NualaCreating from "../../Misc/NualaCreating/NualaCreating";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export default function FeedbackCard({
   t = x => x,
@@ -39,7 +38,8 @@ export default function FeedbackCard({
   goToTimestamp = () => {},
   startTimes = {},
   canSubmitAll = {},
-  setCanSubmit = () => {}
+  setCanSubmit = () => {},
+  setIsGeneratingIndividual = () => {}
 }) {
   const [isRecordingDialogOpen, setIsRecordingDialogOpen] = useState(false);
   const [hasBeenEdited, setHasBeenEdited] = useState(false);
@@ -50,6 +50,7 @@ export default function FeedbackCard({
   const [openPDF, setOpenPDF] = useState(false);
   const [pageNumber, setPageNumber] = useState(1);
   const [scale, setScale] = useState(1);
+  const [isGeneratingFeedback, setIsGeneratingFeedback] = useState(false);
   const handleChangeCheckbox = event => {
     setCheckedSubmissions({
       ...checkedSubmissions,
@@ -159,7 +160,14 @@ export default function FeedbackCard({
   }, [submitTrigger]);
   const handleGenerateAI = async () => {
     setAiJustGenerated(true);
-    await onGenerateFeedback(discussionData);
+    setIsGeneratingFeedback(true);
+    setIsGeneratingIndividual(true);
+    try {
+      await onGenerateFeedback(discussionData);
+    } finally {
+      setIsGeneratingFeedback(false);
+      setIsGeneratingIndividual(false);
+    }
   };
   const handleOpenPDF = () => {
     setOpenPDF(true);
@@ -241,23 +249,7 @@ export default function FeedbackCard({
               overflow: "hidden",
               backgroundColor: "background.paper"
             },
-            children: [aiJustGenerated ? /*#__PURE__*/_jsxs(Grid, {
-              sx: {
-                ...(!aiJustGenerated && {
-                  display: "none"
-                })
-              },
-              mx: 2,
-              size: 12,
-              children: [/*#__PURE__*/_jsx(Typography, {
-                variant: "h6",
-                sx: {
-                  mt: 2,
-                  mb: 2
-                },
-                children: t("generating_feedback")
-              }), /*#__PURE__*/_jsx(NualaCreating, {})]
-            }) : /*#__PURE__*/_jsxs(_Fragment, {
+            children: [/*#__PURE__*/_jsxs(_Fragment, {
               children: [/*#__PURE__*/_jsxs(Box, {
                 sx: {
                   px: 3,
@@ -420,16 +412,16 @@ export default function FeedbackCard({
                 },
                 children: [/*#__PURE__*/_jsx(Button, {
                   variant: "outlined",
-                  disabled: !hasSubmission || aiJustGenerated,
+                  disabled: !hasSubmission || isGeneratingFeedback,
                   onClick: handleOpenRecordingDialog,
                   children: t("view_recording")
                 }), /*#__PURE__*/_jsx(Button, {
                   variant: "contained",
                   color: "secondary",
-                  disabled: !hasSubmission || aiJustGenerated,
+                  disabled: !hasSubmission || isGeneratingFeedback,
                   onClick: handleGenerateAI,
                   endIcon: /*#__PURE__*/_jsx(AutoFixHighIcon, {}),
-                  children: t("generate_feedback")
+                  children: isGeneratingFeedback ? t("generating") : t("generate_feedback")
                 }), /*#__PURE__*/_jsx(Button, {
                   type: "submit",
                   variant: "contained",

package/dist/Chat/BottomBar/BottomBar.js

@@ -154,7 +154,8 @@ export default function BottomBar({
       },
       disableUnderline: true,
       multiline: true,
-      rows: isChallengeBot ? 3 : 1,
+      minRows: isChallengeBot ? 3 : 1,
+      maxRows: 3,
       autoComplete: autoComplete,
       inputRef: activeRef,
       onClick: handleSelectCurrentInput,

package/dist/Dialogs/GroupedFeedbackDialog/GroupedFeedbackDialog.js

@@ -1,5 +1,5 @@
 import { useMemo, useEffect, useState, useRef, useCallback } from "react";
-import { Dialog, DialogContent, IconButton, Box, Typography, AppBar, Toolbar, CircularProgress, Button, Checkbox, Paper, Divider, Tooltip, Skeleton } from "@mui/material";
+import { Dialog, DialogContent, IconButton, Box, Typography, AppBar, Toolbar, CircularProgress, Button, Checkbox, Paper, Divider, Tooltip, Skeleton, Grid } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
 import { red, orange, green, grey } from "@mui/material/colors";
 import FeedbackCard from "../../Cards/FeedbackCard/FeedbackCard";
@@ -7,7 +7,8 @@ import AutoFixHighIcon from "@mui/icons-material/AutoFixHigh";
 import NualaHeadphonesBackground from "../../img/NualaHeadphonesBackground.svg";
 import CheckCircleIcon from "@mui/icons-material/CheckCircle";
 import useConfirm from "../../hooks/useConfirm";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import NualaCreating from "../../Misc/NualaCreating/NualaCreating";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export default function GroupFeedbackDialog({
   open = false,
   onClose = () => {},
@@ -41,6 +42,9 @@ export default function GroupFeedbackDialog({
   const [pendingSubmissions, setPendingSubmissions] = useState(0);
   const [canSubmit, setCanSubmit] = useState({});
   const [hasReachedBottom, setHasReachedBottom] = useState(false);
+  const [isGeneratingAll, setIsGeneratingAll] = useState(false);
+  const [isGeneratingIndividual, setIsGeneratingIndividual] = useState(false);
+  const isAnyGenerating = isGeneratingAll || isGeneratingIndividual;
   const [confirm] = useConfirm(t);
   const bottomRefCallback = useCallback(node => {
     if (node) {
@@ -56,7 +60,7 @@ export default function GroupFeedbackDialog({
     }
   }, []);
   useEffect(() => {
-    // dialog is shared between discussions, so reset when teacher seletcts another discussion
+    // dialog is shared between discussions, so reset when teacher selects another discussion
     setGenerateAllUsed(false);
     setCheckedSubmissions({});
     setCheckedAll(false);
@@ -64,6 +68,7 @@ export default function GroupFeedbackDialog({
     setPendingSubmissions(0);
     setCanSubmit({});
     setHasReachedBottom(false);
+    setIsGeneratingAll(false);
   }, [groupedId]);
   useEffect(() => {
     if (pendingSubmissions === 0 && submitTrigger !== null) {
@@ -149,8 +154,13 @@ export default function GroupFeedbackDialog({
       };
     });
     if (conversationsToGrade.length > 0 && handleBatchGradeConversations) {
+      setIsGeneratingAll(true);
       setGenerateAllUsed(true);
-      await handleBatchGradeConversations(conversationsToGrade);
+      try {
+        await handleBatchGradeConversations(conversationsToGrade);
+      } finally {
+        setIsGeneratingAll(false);
+      }
     }
   };
   const handleSubmitFeedback = async ({
@@ -218,291 +228,341 @@ export default function GroupFeedbackDialog({
     setPendingSubmissions(prev => Math.max(prev - 1, 0));
   };
   const isSubmitAllEnabled = hasReachedBottom && Object.values(canSubmit).some(v => v === true);
-  return /*#__PURE__*/_jsxs(Dialog, {
-    fullScreen: true,
-    open: open,
-    onClose: onClose,
-    "aria-label": "group-feedback-dialog",
-    children: [/*#__PURE__*/_jsx(AppBar, {
-      sx: {
-        position: "relative"
-      },
-      children: /*#__PURE__*/_jsx(Toolbar, {
-        children: /*#__PURE__*/_jsx(IconButton, {
-          edge: "start",
-          color: "inherit",
-          onClick: onClose,
-          "aria-label": "close",
-          children: /*#__PURE__*/_jsx(CloseIcon, {})
-        })
-      })
-    }), /*#__PURE__*/_jsx(DialogContent, {
-      sx: {
-        p: 3,
-        backgroundColor: "background.default"
-      },
-      children: discussionsInGroup.length === 0 ? /*#__PURE__*/_jsx(Box, {
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsxs(Dialog, {
+      fullScreen: true,
+      open: open,
+      onClose: onClose,
+      "aria-label": "group-feedback-dialog",
+      children: [/*#__PURE__*/_jsx(AppBar, {
         sx: {
-          textAlign: "center",
-          py: 8
+          position: "relative"
         },
-        children: /*#__PURE__*/_jsx(Typography, {
-          variant: "h6",
-          color: "text.secondary",
-          children: t("no_discussions_found")
+        children: /*#__PURE__*/_jsx(Toolbar, {
+          children: /*#__PURE__*/_jsx(IconButton, {
+            edge: "start",
+            color: "inherit",
+            onClick: onClose,
+            "aria-label": "close",
+            children: /*#__PURE__*/_jsx(CloseIcon, {})
+          })
         })
-      }) : /*#__PURE__*/_jsxs(Box, {
+      }), /*#__PURE__*/_jsx(DialogContent, {
         sx: {
-          maxWidth: 1400,
-          mx: "auto"
+          p: 3,
+          backgroundColor: "background.default"
         },
-        children: [/*#__PURE__*/_jsxs(Box, {
+        children: discussionsInGroup.length === 0 ? /*#__PURE__*/_jsx(Box, {
           sx: {
-            display: "flex",
-            alignItems: "flex-start",
-            justifyContent: "space-between",
-            mb: 3,
-            gap: 4
+            textAlign: "center",
+            py: 8
           },
-          children: [/*#__PURE__*/_jsx(Box, {
+          children: /*#__PURE__*/_jsx(Typography, {
+            variant: "h6",
+            color: "text.secondary",
+            children: t("no_discussions_found")
+          })
+        }) : /*#__PURE__*/_jsxs(Box, {
+          sx: {
+            maxWidth: 1400,
+            mx: "auto"
+          },
+          children: [/*#__PURE__*/_jsxs(Box, {
             sx: {
-              position: "relative",
-              width: "100%",
-              maxWidth: "300px"
+              display: "flex",
+              alignItems: "flex-start",
+              justifyContent: "space-between",
+              mb: 3,
+              gap: 4
             },
-            children: /*#__PURE__*/_jsxs(Box, {
+            children: [/*#__PURE__*/_jsx(Box, {
               sx: {
                 position: "relative",
                 width: "100%",
-                paddingTop: "56.25%",
-                borderRadius: "8px",
-                overflow: "hidden"
+                maxWidth: "300px"
               },
-              children: [/*#__PURE__*/_jsx(Skeleton, {
-                variant: "rectangular",
+              children: /*#__PURE__*/_jsxs(Box, {
                 sx: {
-                  position: "absolute",
-                  top: 0,
-                  left: 0,
+                  position: "relative",
                   width: "100%",
-                  height: "100%",
+                  paddingTop: "56.25%",
                   borderRadius: "8px",
-                  zIndex: 0
-                }
-              }), /*#__PURE__*/_jsx("img", {
-                src: editMeetingImages || editBackgroundImages || NualaHeadphonesBackground,
-                alt: "Meeting Image",
-                onLoad: e => {
-                  setTimeout(() => {
-                    e.target.style.opacity = 1;
-                  }, 500);
+                  overflow: "hidden"
                 },
-                style: {
-                  position: "absolute",
-                  top: 0,
-                  left: 0,
-                  width: "100%",
-                  height: "100%",
-                  objectFit: "cover",
-                  borderRadius: "8px",
-                  opacity: 0,
-                  transition: "opacity 0.5s ease",
-                  zIndex: 1
-                }
-              })]
-            })
-          }), /*#__PURE__*/_jsxs(Box, {
-            sx: {
-              flexBasis: "70%",
-              maxWidth: "70%"
-            },
-            children: [/*#__PURE__*/_jsx(Typography, {
-              variant: "h5",
-              component: "h2",
-              sx: {
-                fontWeight: 600,
-                mb: 2,
-                color: "text.primary"
-              },
-              children: selectedGroup?.meetingTopic || t("discussion")
-            }), selectedGroup?.meetingPrompt && /*#__PURE__*/_jsx(Typography, {
-              variant: "body2",
-              color: "text.secondary",
+                children: [/*#__PURE__*/_jsx(Skeleton, {
+                  variant: "rectangular",
+                  sx: {
+                    position: "absolute",
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                    height: "100%",
+                    borderRadius: "8px",
+                    zIndex: 0
+                  }
+                }), /*#__PURE__*/_jsx("img", {
+                  src: editMeetingImages || editBackgroundImages || NualaHeadphonesBackground,
+                  alt: "Meeting Image",
+                  onLoad: e => {
+                    setTimeout(() => {
+                      e.target.style.opacity = 1;
+                    }, 500);
+                  },
+                  style: {
+                    position: "absolute",
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                    height: "100%",
+                    objectFit: "cover",
+                    borderRadius: "8px",
+                    opacity: 0,
+                    transition: "opacity 0.5s ease",
+                    zIndex: 1
+                  }
+                })]
+              })
+            }), /*#__PURE__*/_jsxs(Box, {
               sx: {
-                lineHeight: 1.6,
-                whiteSpace: "pre-line"
+                flexBasis: "70%",
+                maxWidth: "70%"
               },
-              children: selectedGroup.meetingPrompt
-            })]
-          }), /*#__PURE__*/_jsxs(Box, {
-            sx: {
-              display: "flex",
-              flexDirection: "column",
-              alignItems: "center",
-              justifyContent: "flex-start",
-              minWidth: 100
-            },
-            children: [/*#__PURE__*/_jsxs(Box, {
+              children: [/*#__PURE__*/_jsx(Typography, {
+                variant: "h5",
+                component: "h2",
+                sx: {
+                  fontWeight: 600,
+                  mb: 2,
+                  color: "text.primary"
+                },
+                children: selectedGroup?.meetingTopic || t("discussion")
+              }), selectedGroup?.meetingPrompt && /*#__PURE__*/_jsx(Typography, {
+                variant: "body2",
+                color: "text.secondary",
+                sx: {
+                  lineHeight: 1.6,
+                  whiteSpace: "pre-line"
+                },
+                children: selectedGroup.meetingPrompt
+              })]
+            }), /*#__PURE__*/_jsxs(Box, {
               sx: {
-                position: "relative",
-                display: "inline-flex",
-                width: 100,
-                height: 100
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                justifyContent: "flex-start",
+                minWidth: 100
               },
-              children: [/*#__PURE__*/_jsx(CircularProgress, {
-                variant: "determinate",
-                value: progress,
-                size: 100,
-                thickness: 4.5,
+              children: [/*#__PURE__*/_jsxs(Box, {
                 sx: {
-                  color: ringColor
-                }
-              }), /*#__PURE__*/_jsx(Box, {
-                sx: {
-                  top: 0,
-                  left: 0,
-                  bottom: 0,
-                  right: 0,
-                  position: "absolute",
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center"
+                  position: "relative",
+                  display: "inline-flex",
+                  width: 100,
+                  height: 100
                 },
-                children: /*#__PURE__*/_jsxs(Typography, {
-                  variant: "h6",
-                  fontWeight: 700,
+                children: [/*#__PURE__*/_jsx(CircularProgress, {
+                  variant: "determinate",
+                  value: progress,
+                  size: 100,
+                  thickness: 4.5,
                   sx: {
                     color: ringColor
+                  }
+                }), /*#__PURE__*/_jsx(Box, {
+                  sx: {
+                    top: 0,
+                    left: 0,
+                    bottom: 0,
+                    right: 0,
+                    position: "absolute",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center"
                   },
-                  children: [submittedCount, " / ", totalDiscussions]
-                })
+                  children: /*#__PURE__*/_jsxs(Typography, {
+                    variant: "h6",
+                    fontWeight: 700,
+                    sx: {
+                      color: ringColor
+                    },
+                    children: [submittedCount, " / ", totalDiscussions]
+                  })
+                })]
+              }), /*#__PURE__*/_jsx(Typography, {
+                variant: "caption",
+                sx: {
+                  mt: 1,
+                  fontWeight: "bold",
+                  color: ringColor,
+                  textAlign: "center",
+                  textTransform: "uppercase",
+                  letterSpacing: 0.2
+                },
+                children: t("submissions")
               })]
+            })]
+          }), /*#__PURE__*/_jsxs(Paper, {
+            elevation: 3,
+            sx: {
+              position: "sticky",
+              top: 8,
+              zIndex: 10,
+              p: 2,
+              mb: 3,
+              display: "flex",
+              alignItems: "center",
+              gap: 2,
+              borderRadius: 2,
+              border: "none",
+              borderColor: "divider",
+              transition: "all 0.3s ease"
+            },
+            children: [/*#__PURE__*/_jsx(Checkbox, {
+              checked: checkedAll,
+              onChange: handleCheckAll,
+              disabled: submittedCount === 0
             }), /*#__PURE__*/_jsx(Typography, {
-              variant: "caption",
+              variant: "body2",
+              fontWeight: 600,
+              children: selectedCount > 0 ? `${selectedCount} ${t("selected")}` : `${t("select_all")} (0 / ${submittedCount})`
+            }), /*#__PURE__*/_jsx(Divider, {
+              orientation: "vertical",
+              flexItem: true,
+              sx: {
+                bgcolor: "rgba(255, 255, 255, 0.3)"
+              }
+            }), /*#__PURE__*/_jsx(Box, {
               sx: {
-                mt: 1,
-                fontWeight: "bold",
-                color: ringColor,
-                textAlign: "center",
-                textTransform: "uppercase",
-                letterSpacing: 0.2
+                flex: 1
+              }
+            }), /*#__PURE__*/_jsx(Button, {
+              variant: "contained",
+              color: "secondary",
+              endIcon: /*#__PURE__*/_jsx(AutoFixHighIcon, {}),
+              disabled: selectedCount === 0 || isGeneratingAll,
+              onClick: handleGenerateFeedbackForAll,
+              sx: {
+                fontWeight: 600
               },
-              children: t("submissions")
+              children: isGeneratingAll ? t("generating") : t("generate_feedback")
+            }), hasReachedBottom ? /*#__PURE__*/_jsx(Button, {
+              variant: "contained",
+              disabled: !isSubmitAllEnabled || selectedCount === 0,
+              endIcon: /*#__PURE__*/_jsx(CheckCircleIcon, {}),
+              onClick: handleSubmitMultipleFeedback,
+              children: t("submit_feedback")
+            }) : /*#__PURE__*/_jsx(Tooltip, {
+              title: t("submit_feedback_scroll"),
+              children: /*#__PURE__*/_jsx("span", {
+                children: /*#__PURE__*/_jsx(Button, {
+                  variant: "contained",
+                  disabled: !isSubmitAllEnabled || selectedCount === 0,
+                  endIcon: /*#__PURE__*/_jsx(CheckCircleIcon, {}),
+                  onClick: handleSubmitMultipleFeedback,
+                  children: t("submit_feedback")
+                })
+              })
             })]
+          }), discussionsInGroup.sort((a, b) => {
+            const aHasSubmission = Boolean(submissionsByMeetingId[a.meetingID || a.meetingId]);
+            const bHasSubmission = Boolean(submissionsByMeetingId[b.meetingID || b.meetingId]);
+            return bHasSubmission - aHasSubmission;
+          }).map((discussion, index) => {
+            const discMeetingId = discussion.meetingID || discussion.meetingId;
+            const submissionForThisDiscussion = submissionsByMeetingId[discMeetingId];
+            const hasSubmission = Boolean(submissionForThisDiscussion);
+            const discussionData = {
+              ...discussion,
+              ...(submissionForThisDiscussion || {}),
+              conversation: submissionForThisDiscussion?.conversation || [],
+              s3Url: submissionForThisDiscussion?.s3Url || "",
+              joinedMembers: submissionForThisDiscussion?.joinedMembers || [],
+              hasBadLanguage: submissionForThisDiscussion?.hasBadLanguage || false,
+              meetingId: submissionForThisDiscussion?.meetingId || submissionForThisDiscussion?.meetingID,
+              extMeetingId: submissionForThisDiscussion?.extMeetingId,
+              creator: submissionForThisDiscussion?.creator
+            };
+            const feedbackMeetingId = submissionForThisDiscussion?.meetingId || submissionForThisDiscussion?.meetingID;
+            return /*#__PURE__*/_jsx(FeedbackCard, {
+              t: t,
+              discussionData: discussionData,
+              userData: userData,
+              hasSubmission: hasSubmission,
+              aiGrade: aiGrade[discussionData.meetingId || discussionData.meetingID] || {},
+              existingFeedback: feedbackByMeetingId[feedbackMeetingId] || {},
+              onGenerateFeedback: () => handleGenerateFeedback(discussionData),
+              onSubmitFeedback: handleSubmitFeedback,
+              setSelectedRecording: setSelectedRecording,
+              selectedRecording: selectedRecording,
+              s3Url: s3Url,
+              playerRef: playerRef,
+              conversation: conversation,
+              generateAllUsed: generateAllUsed,
+              setGenerateAllUsed: setGenerateAllUsed,
+              checkedSubmissions: checkedSubmissions,
+              setCheckedSubmissions: setCheckedSubmissions,
+              submitTrigger: checkedSubmissions[discussionData.meetingId || discussionData.meetingID] ? submitTrigger : null,
+              onSubmissionComplete: handleSubmissionComplete,
+              goToTimestamp: goToTimestamp,
+              startTimes: startTimes,
+              canSubmitAll: canSubmit,
+              setCanSubmit: setCanSubmit,
+              setIsGeneratingIndividual: setIsGeneratingIndividual
+            }, discussion.meetingId || discussion.meetingID || index);
+          }), /*#__PURE__*/_jsx("div", {
+            ref: bottomRefCallback,
+            style: {
+              height: 1
+            }
           })]
-        }), /*#__PURE__*/_jsxs(Paper, {
-          elevation: 3,
+        })
+      })]
+    }), /*#__PURE__*/_jsx(Dialog, {
+      open: isAnyGenerating,
+      maxWidth: "sm",
+      fullWidth: true,
+      PaperProps: {
+        sx: {
+          borderRadius: 3,
+          overflow: "visible"
+        }
+      },
+      children: /*#__PURE__*/_jsx(DialogContent, {
+        sx: {
+          p: 4
+        },
+        children: /*#__PURE__*/_jsx(Grid, {
+          container: true,
           sx: {
-            position: "sticky",
-            top: 8,
-            zIndex: 10,
-            p: 2,
-            mb: 3,
-            display: "flex",
-            alignItems: "center",
-            gap: 2,
-            borderRadius: 2,
-            border: "none",
-            borderColor: "divider",
-            transition: "all 0.3s ease"
+            width: "100%"
           },
-          children: [/*#__PURE__*/_jsx(Checkbox, {
-            checked: checkedAll,
-            onChange: handleCheckAll,
-            disabled: submittedCount === 0
-          }), /*#__PURE__*/_jsx(Typography, {
-            variant: "body2",
-            fontWeight: 600,
-            children: selectedCount > 0 ? `${selectedCount} ${t("selected")}` : `${t("select_all")} (0 / ${submittedCount})`
-          }), /*#__PURE__*/_jsx(Divider, {
-            orientation: "vertical",
-            flexItem: true,
-            sx: {
-              bgcolor: "rgba(255, 255, 255, 0.3)"
-            }
-          }), /*#__PURE__*/_jsx(Box, {
-            sx: {
-              flex: 1
-            }
-          }), /*#__PURE__*/_jsx(Button, {
-            variant: "contained",
-            color: "secondary",
-            endIcon: /*#__PURE__*/_jsx(AutoFixHighIcon, {}),
-            disabled: selectedCount === 0,
-            onClick: handleGenerateFeedbackForAll,
+          children: /*#__PURE__*/_jsxs(Grid, {
+            size: 12,
             sx: {
-              fontWeight: 600
+              display: "flex",
+              flexDirection: "column",
+              alignItems: "center",
+              justifyContent: "center",
+              textAlign: "center",
+              gap: 3,
+              py: 2
             },
-            children: t("generate_feedback")
-          }), hasReachedBottom ? /*#__PURE__*/_jsx(Button, {
-            variant: "contained",
-            disabled: !isSubmitAllEnabled || selectedCount === 0,
-            endIcon: /*#__PURE__*/_jsx(CheckCircleIcon, {}),
-            onClick: handleSubmitMultipleFeedback,
-            children: t("submit_feedback")
-          }) : /*#__PURE__*/_jsx(Tooltip, {
-            title: t("submit_feedback_scroll"),
-            children: /*#__PURE__*/_jsx("span", {
-              children: /*#__PURE__*/_jsx(Button, {
-                variant: "contained",
-                disabled: !isSubmitAllEnabled || selectedCount === 0,
-                endIcon: /*#__PURE__*/_jsx(CheckCircleIcon, {}),
-                onClick: handleSubmitMultipleFeedback,
-                children: t("submit_feedback")
-              })
-            })
-          })]
-        }), discussionsInGroup.sort((a, b) => {
-          const aHasSubmission = Boolean(submissionsByMeetingId[a.meetingID || a.meetingId]);
-          const bHasSubmission = Boolean(submissionsByMeetingId[b.meetingID || b.meetingId]);
-          return bHasSubmission - aHasSubmission;
-        }).map((discussion, index) => {
-          const discMeetingId = discussion.meetingID || discussion.meetingId;
-          const submissionForThisDiscussion = submissionsByMeetingId[discMeetingId];
-          const hasSubmission = Boolean(submissionForThisDiscussion);
-          const discussionData = {
-            ...discussion,
-            ...(submissionForThisDiscussion || {}),
-            conversation: submissionForThisDiscussion?.conversation || [],
-            s3Url: submissionForThisDiscussion?.s3Url || "",
-            joinedMembers: submissionForThisDiscussion?.joinedMembers || [],
-            hasBadLanguage: submissionForThisDiscussion?.hasBadLanguage || false,
-            meetingId: submissionForThisDiscussion?.meetingId || submissionForThisDiscussion?.meetingID,
-            extMeetingId: submissionForThisDiscussion?.extMeetingId,
-            creator: submissionForThisDiscussion?.creator
-          };
-          const feedbackMeetingId = submissionForThisDiscussion?.meetingId || submissionForThisDiscussion?.meetingID;
-          return /*#__PURE__*/_jsx(FeedbackCard, {
-            t: t,
-            discussionData: discussionData,
-            userData: userData,
-            hasSubmission: hasSubmission,
-            aiGrade: aiGrade[discussionData.meetingId || discussionData.meetingID] || {},
-            existingFeedback: feedbackByMeetingId[feedbackMeetingId] || {},
-            onGenerateFeedback: () => handleGenerateFeedback(discussionData),
-            onSubmitFeedback: handleSubmitFeedback,
-            setSelectedRecording: setSelectedRecording,
-            selectedRecording: selectedRecording,
-            s3Url: s3Url,
-            playerRef: playerRef,
-            conversation: conversation,
-            generateAllUsed: generateAllUsed,
-            setGenerateAllUsed: setGenerateAllUsed,
-            checkedSubmissions: checkedSubmissions,
-            setCheckedSubmissions: setCheckedSubmissions,
-            submitTrigger: checkedSubmissions[discussionData.meetingId || discussionData.meetingID] ? submitTrigger : null,
-            onSubmissionComplete: handleSubmissionComplete,
-            goToTimestamp: goToTimestamp,
-            startTimes: startTimes,
-            canSubmitAll: canSubmit,
-            setCanSubmit: setCanSubmit
-          }, discussion.meetingId || discussion.meetingID || index);
-        }), /*#__PURE__*/_jsx("div", {
-          ref: bottomRefCallback,
-          style: {
-            height: 1
-          }
-        })]
+            children: [/*#__PURE__*/_jsx(Typography, {
+              variant: "h5",
+              sx: {
+                fontWeight: 600,
+                color: "text.primary"
+              },
+              children: t("generating_feedback")
+            }), /*#__PURE__*/_jsx(Box, {
+              sx: {
+                maxWidth: 500,
+                width: "100%"
+              },
+              children: /*#__PURE__*/_jsx(NualaCreating, {})
+            })]
+          })
+        })
       })
     })]
   });

package/dist/Forms/Contact/Contact.js

@@ -34,6 +34,7 @@ function Contact({
     freeTrial: false,
     requestDemo: false,
     newsAndUpdates: false,
+    jobTitle: "",
     ...initialValues
   });
   const handleChange = event => {
@@ -65,7 +66,8 @@ function Contact({
     message,
     freeTrial,
     requestDemo,
-    newsAndUpdates
+    newsAndUpdates,
+    jobTitle
   } = values;
   const roles = [{
     value: "",
@@ -277,6 +279,23 @@ function Contact({
               rows: 3,
               maxRows: 3
             })
+          }), /*#__PURE__*/_jsx(Grid, {
+            size: 12,
+            children: /*#__PURE__*/_jsx(TextField, {
+              name: "jobTitle",
+              value: jobTitle || "",
+              onChange: handleChange,
+              autoComplete: "off",
+              tabIndex: -1,
+              sx: {
+                position: "absolute",
+                left: "-10000px",
+                top: "auto",
+                width: "1px",
+                height: "1px",
+                overflow: "hidden"
+              }
+            })
           }), !disableCheckboxes && /*#__PURE__*/_jsx(Grid, {
             size: 12,
             children: /*#__PURE__*/_jsxs(FormControl, {

package/dist/Lists/ListElements/index.js

@@ -7,7 +7,7 @@ const SingleLineGridList = styled(ImageList)(() => ({
 }));
 const minWidth = {
   xs: 330,
-  sm: 380
+  sm: 360
 };
 const SingleLineGridListItem = styled(ImageListItem)(({
   theme

package/dist/Misc/NualaCreating/NualaCreating.js

@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { Box } from "@mui/material";
 import Nuala from "./Nuala1";
 import Nuala2 from "./Nuala2";
@@ -8,8 +9,10 @@ export default function NualaCreating() {
   // Create an array with the three components
   const images = [/*#__PURE__*/_jsx(Nuala, {}), /*#__PURE__*/_jsx(Nuala2, {}), /*#__PURE__*/_jsx(Nuala3, {})];
 
-  // Randomly select one of the images
-  const randomImage = images[Math.floor(Math.random() * images.length)];
+  // Use useState to pick a random image only once on mount
+  const [randomImage] = useState(() => {
+    return images[Math.floor(Math.random() * images.length)];
+  });
   return /*#__PURE__*/_jsx(Box, {
     sx: {
       maxWidth: 500,

package/dist/Navigation/Breadcrumbs/Breadcrumbs.js

@@ -108,7 +108,7 @@ export default function AppBreadcrumbs(props) {
   } = props;
   routes = appRoutes;
   return /*#__PURE__*/_jsx(Paper, {
-    elevation: 0,
+    elevation: 1,
     square: true,
     className: classes.paper,
     children: /*#__PURE__*/_jsx(Breadcrumbs, {})

package/package.json

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