@nualang/nualang-ui-components 0.1.1399 → 0.2.0

package/dist/Tables/Progress/Header.js

@@ -1,559 +0,0 @@
-import React from "react";
-import Box from "@mui/material/Box";
-import Typography from "@mui/material/Typography";
-import { TableSortLabel, Chip } from "@mui/material";
-import IconButton from "@mui/material/IconButton";
-import ArrowBackIcon from "@mui/icons-material/ArrowBack";
-import ArrowForwardIcon from "@mui/icons-material/ArrowForward";
-import DefaultButton from "../../Misc/DefaultColourButton/DefaultColourButton";
-import { TableHead } from "./styledComponents";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-export default function ProgressTableHeader(props) {
-  const {
-    t,
-    reportType,
-    currentView,
-    hideSorting,
-    sortColumn,
-    sortDirection,
-    handleSort,
-    setSelectedCourse,
-    setSelectedSection,
-    setSelectedTopic,
-    setSelectedRoleplay,
-    deleteCourseId,
-    deleteAssignmentId,
-    selectedCourse,
-    selectedSection,
-    selectedTopic,
-    selectedRoleplay,
-    selectedAssignment,
-    courses,
-    tableTopics,
-    tableExercises,
-    tableRoleplays,
-    tableRoleplayGames,
-    tableBots,
-    roleplays
-  } = props;
-  return /*#__PURE__*/_jsx(TableHead, {
-    children: /*#__PURE__*/_jsxs("tr", {
-      children: [/*#__PURE__*/_jsxs("th", {
-        scope: "col",
-        children: [reportType === "courses" && currentView === "all_courses" && /*#__PURE__*/_jsx(Box, {
-          sx: {
-            width: "100%",
-            justifyContent: "center"
-          },
-          children: /*#__PURE__*/_jsx(TableSortLabel, {
-            active: sortColumn === "student" && !hideSorting,
-            direction: sortDirection || "asc",
-            onClick: () => {
-              handleSort("student");
-            },
-            disabled: hideSorting,
-            children: /*#__PURE__*/_jsx(Typography, {
-              variant: "subtitle1",
-              component: "div",
-              sx: {
-                fontWeight: "bold"
-              },
-              children: t("courses")
-            })
-          })
-        }), currentView === "course" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => deleteCourseId(),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsx(TableSortLabel, {
-              active: sortColumn === "student" && !hideSorting,
-              direction: sortDirection || "asc",
-              onClick: () => {
-                handleSort("student");
-              },
-              disabled: hideSorting,
-              children: /*#__PURE__*/_jsxs(Box, {
-                sx: {
-                  flex: "1 1 auto",
-                  textAlign: "left"
-                },
-                children: [/*#__PURE__*/_jsx(Typography, {
-                  variant: selectedCourse ? "caption" : "subtitle1",
-                  component: "div",
-                  sx: {
-                    fontWeight: "bold"
-                  },
-                  children: t("courses")
-                }), /*#__PURE__*/_jsx(Typography, {
-                  variant: "subtitle1",
-                  component: "div",
-                  sx: {
-                    fontWeight: "bold"
-                  },
-                  children: selectedCourse?.courseName
-                })]
-              })
-            })]
-          })
-        }), currentView === "section" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => setSelectedSection(null),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsx(TableSortLabel, {
-              active: sortColumn === "student" && !hideSorting,
-              direction: sortDirection || "asc",
-              onClick: () => {
-                handleSort("student");
-              },
-              disabled: hideSorting,
-              children: /*#__PURE__*/_jsxs(Box, {
-                sx: {
-                  flex: "1 1 auto",
-                  textAlign: "left"
-                },
-                children: [/*#__PURE__*/_jsxs(Typography, {
-                  variant: "caption",
-                  component: "div",
-                  sx: {
-                    fontWeight: "bold"
-                  },
-                  children: [t("courses"), " | ", selectedCourse?.courseName]
-                }), /*#__PURE__*/_jsx(Typography, {
-                  variant: "subtitle1",
-                  component: "div",
-                  sx: {
-                    fontWeight: "bold"
-                  },
-                  children: selectedSection?.sectionName
-                })]
-              })
-            })]
-          })
-        }), currentView === "topic" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => setSelectedTopic(null),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsxs(Box, {
-              sx: {
-                flex: "1 1 auto",
-                textAlign: "left"
-              },
-              children: [/*#__PURE__*/_jsxs(Typography, {
-                variant: "caption",
-                component: "h3",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: [t("courses"), " | ", selectedCourse?.courseName]
-              }), /*#__PURE__*/_jsxs(Typography, {
-                variant: "subtitle1",
-                component: "div",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: [selectedSection?.sectionName, " | ", selectedTopic?.topicName]
-              })]
-            })]
-          })
-        }), currentView === "roleplay" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => setSelectedRoleplay(null),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsxs(Box, {
-              sx: {
-                flex: "1 1 auto",
-                textAlign: "left"
-              },
-              children: [/*#__PURE__*/_jsxs(Typography, {
-                variant: "caption",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: [selectedCourse?.courseName, " | ", selectedSection?.sectionName]
-              }), /*#__PURE__*/_jsxs(Typography, {
-                variant: "subtitle1",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: [selectedTopic?.topicName, " | ", selectedRoleplay?.roleplayName]
-              })]
-            })]
-          })
-        }), reportType === "assignments" && currentView === "assignments" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsx(Box, {
-            sx: () => ({
-              width: "100%",
-              justifyContent: "center"
-            }),
-            children: /*#__PURE__*/_jsx(TableSortLabel, {
-              active: sortColumn === "student" && !hideSorting,
-              direction: sortDirection || "asc",
-              onClick: () => {
-                handleSort("student");
-              },
-              disabled: hideSorting,
-              children: /*#__PURE__*/_jsx(Typography, {
-                variant: "subtitle1",
-                component: "div",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: t("assignments")
-              })
-            })
-          })
-        }), reportType === "assignments" && currentView === "assignment-topics" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => deleteAssignmentId(),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsx(TableSortLabel, {
-              active: sortColumn === "student" && !hideSorting,
-              direction: sortDirection || "asc",
-              onClick: () => {
-                handleSort("student");
-              },
-              disabled: hideSorting,
-              children: /*#__PURE__*/_jsxs(Box, {
-                sx: {
-                  flex: "1 1 auto",
-                  textAlign: "left"
-                },
-                children: [/*#__PURE__*/_jsx(Typography, {
-                  variant: "caption",
-                  component: "div",
-                  children: `${selectedAssignment?.assignedStudents?.length || 0} ${t("assigned")} | ${t("due_date")} ${selectedAssignment?.dueDate || ""}`
-                }), /*#__PURE__*/_jsx(Typography, {
-                  variant: "subtitle1",
-                  component: "div",
-                  sx: {
-                    fontWeight: "bold"
-                  },
-                  children: selectedAssignment?.title
-                })]
-              })
-            })]
-          })
-        }), reportType === "assignments" && currentView === "assignment-topic" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => setSelectedTopic(null),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsxs(Box, {
-              sx: {
-                flex: "1 1 auto",
-                textAlign: "left"
-              },
-              children: [/*#__PURE__*/_jsx(Typography, {
-                variant: "caption",
-                component: "h3",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: selectedAssignment?.title
-              }), /*#__PURE__*/_jsx(Typography, {
-                variant: "subtitle1",
-                component: "div",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: selectedTopic?.topicName
-              })]
-            })]
-          })
-        }), reportType === "assignments" && currentView === "assignment-roleplay" && /*#__PURE__*/_jsx(_Fragment, {
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: () => ({
-              display: "flex",
-              textAlign: "left",
-              alignItems: "center"
-            }),
-            children: [/*#__PURE__*/_jsx(Box, {
-              sx: {
-                minWidth: 56
-              },
-              children: /*#__PURE__*/_jsx(IconButton, {
-                onClick: () => setSelectedRoleplay(null),
-                children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
-              })
-            }), /*#__PURE__*/_jsxs(Box, {
-              sx: {
-                flex: "1 1 auto",
-                textAlign: "left"
-              },
-              children: [/*#__PURE__*/_jsxs(Typography, {
-                variant: "caption",
-                component: "h3",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: [selectedAssignment?.title, " | ", selectedTopic?.topicName]
-              }), /*#__PURE__*/_jsx(Typography, {
-                variant: "subtitle1",
-                component: "div",
-                sx: {
-                  fontWeight: "bold"
-                },
-                children: selectedRoleplay?.roleplayName
-              })]
-            })]
-          })
-        })]
-      }), reportType === "courses" && currentView === "all_courses" && courses?.map((c, i) => /*#__PURE__*/_jsxs("th", {
-        scope: "col",
-        children: [/*#__PURE__*/_jsx(Box, {
-          sx: {
-            width: "100%",
-            justifyContent: "center"
-          },
-          children: /*#__PURE__*/_jsx(TableSortLabel, {
-            active: sortColumn === c.courseId,
-            direction: sortDirection || "asc",
-            onClick: () => {
-              handleSort(c.courseId);
-            },
-            disabled: hideSorting,
-            children: /*#__PURE__*/_jsx(Typography, {
-              variant: "subtitle1",
-              component: "div",
-              sx: {
-                fontWeight: "bold",
-                marginLeft: "20px"
-              },
-              children: c.courseName
-            }, `student-progress-courses-${i}`)
-          })
-        }), /*#__PURE__*/_jsx(DefaultButton, {
-          "aria-expanded": Boolean(currentView === "course"),
-          tabIndex: 0,
-          endIcon: /*#__PURE__*/_jsx(ArrowForwardIcon, {}),
-          size: "small",
-          onClick: () => setSelectedCourse(c),
-          sx: {
-            fontSize: "0.75rem",
-            "@media print": {
-              display: "none"
-            }
-          },
-          children: t("view_course")
-        })]
-      }, i)), reportType === "courses" && currentView === "course" && selectedCourse?.sections?.map((s, i) => /*#__PURE__*/_jsxs("th", {
-        scope: "col",
-        children: [/*#__PURE__*/_jsx(Box, {
-          sx: {
-            width: "100%",
-            justifyContent: "center"
-          },
-          children: /*#__PURE__*/_jsx(TableSortLabel, {
-            active: sortColumn === s.sectionId,
-            direction: sortDirection || "asc",
-            onClick: () => {
-              handleSort(s.sectionId);
-            },
-            disabled: hideSorting,
-            children: /*#__PURE__*/_jsx(Typography, {
-              variant: "subtitle1",
-              component: "div",
-              sx: {
-                fontWeight: "bold",
-                marginLeft: "20px"
-              },
-              children: s.sectionName
-            }, `student-progress-courses-${i}`)
-          })
-        }), /*#__PURE__*/_jsx(DefaultButton, {
-          "aria-expanded": Boolean(currentView === "section"),
-          endIcon: /*#__PURE__*/_jsx(ArrowForwardIcon, {}),
-          size: "small",
-          onClick: () => setSelectedSection(s),
-          sx: {
-            fontSize: "0.75rem",
-            "@media print": {
-              display: "none"
-            }
-          },
-          children: t("view_section")
-        })]
-      }, i)), (currentView === "section" || currentView === "assignment-topics") && tableTopics?.map((tpc, i) => /*#__PURE__*/_jsxs("th", {
-        scope: "col",
-        children: [/*#__PURE__*/_jsx(Box, {
-          sx: {
-            width: "100%",
-            justifyContent: "center"
-          },
-          children: /*#__PURE__*/_jsx(TableSortLabel, {
-            active: sortColumn === tpc.topicId,
-            direction: sortDirection || "asc",
-            onClick: () => {
-              if (currentView === "assignment-topics") {
-                handleSort(`${tpc.courseSectionId}|${tpc.topicId}`);
-              } else {
-                handleSort(tpc.topicId);
-              }
-            },
-            disabled: hideSorting,
-            children: /*#__PURE__*/_jsxs(Box, {
-              sx: {
-                flex: "1 1 auto"
-              },
-              children: [reportType === "assignments" && /*#__PURE__*/_jsx(Typography, {
-                variant: "caption",
-                component: "div",
-                sx: {
-                  marginLeft: "20px"
-                },
-                children: courses?.[courses?.findIndex(c => c.courseId === tpc.courseSectionId.split("|")[0])]?.courseName
-              }), /*#__PURE__*/_jsx(Typography, {
-                variant: "subtitle1",
-                component: "div",
-                sx: {
-                  fontWeight: "bold",
-                  marginLeft: "20px"
-                },
-                children: tpc.topicName
-              })]
-            }, `student-progress-courses-${i}`)
-          })
-        }), /*#__PURE__*/_jsx(DefaultButton, {
-          "aria-expanded": Boolean(currentView === "topic"),
-          endIcon: /*#__PURE__*/_jsx(ArrowForwardIcon, {}),
-          size: "small",
-          onClick: () => setSelectedTopic(tpc),
-          sx: {
-            fontSize: "0.75rem",
-            "@media print": {
-              display: "none"
-            }
-          },
-          children: t("view_topic")
-        })]
-      }, i)), (currentView === "topic" || currentView === "assignment-topic") && tableExercises?.map((exercise, i) => /*#__PURE__*/_jsx("th", {
-        scope: "col",
-        children: /*#__PURE__*/_jsx(Typography, {
-          variant: "subtitle1",
-          component: "div",
-          sx: {
-            fontWeight: "bold"
-          },
-          children: t(exercise)
-        }, `student-progress-exercises-${i}`)
-      }, i)), (currentView === "topic" || currentView === "assignment-topic") && tableRoleplays?.length > 0 && tableRoleplays?.map((roleplay, i) => /*#__PURE__*/_jsxs("th", {
-        scope: "col",
-        children: [/*#__PURE__*/_jsx(Typography, {
-          sx: {
-            fontWeight: "bold"
-          },
-          children: roleplay.roleplayName
-        }), /*#__PURE__*/_jsx(DefaultButton, {
-          endIcon: /*#__PURE__*/_jsx(ArrowForwardIcon, {}),
-          size: "small",
-          onClick: () => setSelectedRoleplay(roleplay),
-          sx: {
-            fontSize: "0.75rem",
-            "@media print": {
-              display: "none"
-            }
-          },
-          children: t("view_roleplay")
-        })]
-      }, i)), (currentView === "topic" || currentView === "assignment-topic") && tableBots?.length > 0 && tableBots?.map((bot, i) => /*#__PURE__*/_jsx("th", {
-        scope: "col",
-        children: /*#__PURE__*/_jsxs(Box, {
-          sx: {
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-            gap: 0.5
-          },
-          children: [/*#__PURE__*/_jsx(Typography, {
-            variant: "subtitle1",
-            sx: {
-              fontWeight: "bold"
-            },
-            children: bot.botName
-          }, `student-progress-exercises-name-${i}`), bot.isChallengeBot && /*#__PURE__*/_jsx(Chip, {
-            label: t("challenge_bot"),
-            size: "small",
-            variant: "outlined",
-            color: "primary",
-            sx: {
-              fontWeight: "normal"
-            }
-          })]
-        })
-      }, i)), (currentView === "roleplay" || currentView === "assignment-roleplay") && tableRoleplayGames?.map((roleplay, i) => /*#__PURE__*/_jsx("th", {
-        scope: "col",
-        children: /*#__PURE__*/_jsx(Typography, {
-          sx: {
-            fontWeight: "bold"
-          },
-          children: roleplay
-        })
-      }, i))]
-    })
-  });
-}