{
- // e.preventDefault();
e.stopPropagation();
}}
className={
diff --git a/src/components/Tooltip.tsx b/src/components/Tooltip.tsx
index 2a8a3c5..6d09044 100644
--- a/src/components/Tooltip.tsx
+++ b/src/components/Tooltip.tsx
@@ -18,10 +18,10 @@ export const Tooltip: React.FC<{
" absolute -translate-x-1/2 " +
" bg-gray-900 text-slate-200 text-sm " +
" rounded-md py-1 px-2 " +
- " transition-all duration-400 " +
+ " transition-opacity duration-150 " +
" border border-slate-700 shadow-[0px_0px_10px_5px] shadow-slate-500/20 " +
" max-w-sm max-h-64 overflow-hidden " +
- (visible ? " " : " hidden -z-50 ")
+ (visible ? " opacity-100 " : " opacity-0 pointer-events-none hidden ")
}
role="tooltip"
>
diff --git a/src/components/editor/MonacoEditor.css b/src/components/editor/MonacoEditor.css
index 6252a83..7c578c9 100644
--- a/src/components/editor/MonacoEditor.css
+++ b/src/components/editor/MonacoEditor.css
@@ -9,6 +9,9 @@
background-color: #030712 !important;
/* background-color: #101828 !important; */
}
+.sticky-widget {
+ background-color: #0C0F17 !important;
+}
.monaco-editor {
position: absolute !important;
}
diff --git a/src/components/icons/ExpandIcon.tsx b/src/components/icons/ExpandIcon.tsx
index 6a3f10e..0ae03b8 100644
--- a/src/components/icons/ExpandIcon.tsx
+++ b/src/components/icons/ExpandIcon.tsx
@@ -16,19 +16,19 @@ export default function ExpandIcon({
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
-
+
diff --git a/src/components/icons/HomeIcon.tsx b/src/components/icons/HomeIcon.tsx
new file mode 100644
index 0000000..6c59799
--- /dev/null
+++ b/src/components/icons/HomeIcon.tsx
@@ -0,0 +1,23 @@
+import React from "react";
+
+// https://www.svgrepo.com/collection/wolf-kit-solid-glyph-icons/?search=home
+export default function HomeIcon() {
+ return (
+
+ );
+}
diff --git a/src/components/icons/RightSingleChevron.tsx b/src/components/icons/RightSingleChevron.tsx
new file mode 100644
index 0000000..4d4f8ea
--- /dev/null
+++ b/src/components/icons/RightSingleChevron.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+// https://www.svgrepo.com/svg/491374/chevron-small-right
+export const RightSingleChevron = () => {
+ return (
+
+ );
+};
diff --git a/src/components/realtime/ClientCacheInvalidation.tsx b/src/components/realtime/ClientCacheInvalidation.tsx
index dfbde2b..eef5b28 100644
--- a/src/components/realtime/ClientCacheInvalidation.tsx
+++ b/src/components/realtime/ClientCacheInvalidation.tsx
@@ -4,6 +4,8 @@ import { useTRPC } from "@/services/serverFunctions/trpcClient";
import React, { useCallback, useEffect, useState } from "react";
import { io, Socket } from "socket.io-client";
import { useQueryClient } from "@tanstack/react-query";
+import { useGlobalSettingsQuery } from "@/features/local/globalSettings/globalSettingsHooks";
+import { GlobalSettings } from "@/features/local/globalSettings/globalSettingsModels";
interface ServerToClientEvents {
message: (data: string) => void;
@@ -24,6 +26,22 @@ function removeFileExtension(fileName: string): string {
return fileName;
}
+function getCourseNameByPath(
+ filePath: string,
+ settings: GlobalSettings
+) {
+ const courseSettings = settings.courses.find((c) => {
+ const normalizedFilePath = filePath.startsWith("./")
+ ? filePath.substring(2)
+ : filePath;
+ const normalizedCoursePath = c.path.startsWith("./")
+ ? c.path.substring(2)
+ : c.path;
+ return normalizedFilePath.startsWith(normalizedCoursePath);
+ });
+ return courseSettings?.name;
+}
+
export function ClientCacheInvalidation() {
const invalidateCache = useFilePathInvalidation();
const [connectionAttempted, setConnectionAttempted] = useState(false);
@@ -62,13 +80,32 @@ export function ClientCacheInvalidation() {
const useFilePathInvalidation = () => {
const trpc = useTRPC();
const queryClient = useQueryClient();
+ const { data: settings } = useGlobalSettingsQuery();
+
return useCallback(
(filePath: string) => {
- const [courseName, moduleOrLectures, itemType, itemFile] =
- filePath.split("/");
+ const courseName = getCourseNameByPath(filePath, settings);
+ // console.log(filePath, settings, courseName);
+ if (!courseName) {
+ console.log(
+ "no course settings found for file path, not invalidating cache",
+ filePath
+ );
+ return;
+ }
+
+ const splitPath = filePath.split("/");
+ const [moduleOrLectures, itemType, itemFile] = splitPath.slice(-3);
const itemName = itemFile ? removeFileExtension(itemFile) : undefined;
- const allParts = [courseName, moduleOrLectures, itemType, itemName];
+ const allParts = { courseName, moduleOrLectures, itemType, itemName };
+ // console.log(
+ // "received file to invalidate",
+ // filePath,
+ // allParts,
+ // itemName,
+ // itemType
+ // );
if (moduleOrLectures === "settings.yml") {
queryClient.invalidateQueries({
@@ -141,6 +178,8 @@ const useFilePathInvalidation = () => {
});
return;
}
+
+ console.log("no cache invalidation match for file ", allParts);
},
[
queryClient,
@@ -153,6 +192,7 @@ const useFilePathInvalidation = () => {
trpc.quiz.getQuiz,
trpc.settings.allCoursesSettings,
trpc.settings.courseSettings,
+ settings,
]
);
};
diff --git a/src/components/useTooltip.ts b/src/components/useTooltip.ts
new file mode 100644
index 0000000..78cfbf2
--- /dev/null
+++ b/src/components/useTooltip.ts
@@ -0,0 +1,28 @@
+import { useState, useRef, useCallback } from "react";
+
+export const useTooltip = (delayMs: number = 150) => {
+ const [visible, setVisible] = useState(false);
+ const timeoutRef = useRef
(null);
+ const targetRef = useRef(null);
+
+ const showTooltip = useCallback(() => {
+ timeoutRef.current = setTimeout(() => {
+ setVisible(true);
+ }, delayMs);
+ }, [delayMs]);
+
+ const hideTooltip = useCallback(() => {
+ if (timeoutRef.current) {
+ clearTimeout(timeoutRef.current);
+ timeoutRef.current = null;
+ }
+ setVisible(false);
+ }, []);
+
+ return {
+ visible,
+ targetRef,
+ showTooltip,
+ hideTooltip,
+ };
+};
diff --git a/src/features/local/assignments/assignmentRouter.ts b/src/features/local/assignments/assignmentRouter.ts
index 8bdf173..ef12292 100644
--- a/src/features/local/assignments/assignmentRouter.ts
+++ b/src/features/local/assignments/assignmentRouter.ts
@@ -10,6 +10,7 @@ import { getCoursePathByName } from "../globalSettings/globalSettingsFileStorage
import { promises as fs } from "fs";
import { courseItemFileStorageService } from "../course/courseItemFileStorageService";
import { assignmentMarkdownSerializer } from "./models/utils/assignmentMarkdownSerializer";
+import { assertValidFileName } from "@/services/fileNameValidation";
export const assignmentRouter = router({
getAssignment: publicProcedure
@@ -133,17 +134,7 @@ export async function updateOrCreateAssignmentFile({
assignmentName: string;
assignment: LocalAssignment;
}) {
- const illegalCharacters = ["<", ">", ":", '"', "/", "\\", "|", "?", "*"];
- const foundIllegalCharacters = illegalCharacters.filter((char) =>
- assignmentName.includes(char)
- );
- if (foundIllegalCharacters.length > 0) {
- throw new Error(
- `"${assignmentName}" cannot contain the following characters: ${foundIllegalCharacters.join(
- " "
- )}`
- );
- }
+ assertValidFileName(assignmentName);
const courseDirectory = await getCoursePathByName(courseName);
const folder = path.join(courseDirectory, moduleName, "assignments");
diff --git a/src/features/local/pages/pageRouter.ts b/src/features/local/pages/pageRouter.ts
index 0290a01..a97d968 100644
--- a/src/features/local/pages/pageRouter.ts
+++ b/src/features/local/pages/pageRouter.ts
@@ -1,11 +1,16 @@
import publicProcedure from "../../../services/serverFunctions/publicProcedure";
import { z } from "zod";
import { router } from "../../../services/serverFunctions/trpcSetup";
-import { LocalCoursePage, localPageMarkdownUtils, zodLocalCoursePage } from "@/features/local/pages/localCoursePageModels";
+import {
+ LocalCoursePage,
+ localPageMarkdownUtils,
+ zodLocalCoursePage,
+} from "@/features/local/pages/localCoursePageModels";
import { courseItemFileStorageService } from "../course/courseItemFileStorageService";
import { promises as fs } from "fs";
import path from "path";
import { getCoursePathByName } from "../globalSettings/globalSettingsFileStorageService";
+import { assertValidFileName } from "@/services/fileNameValidation";
export const pageRouter = router({
getPage: publicProcedure
@@ -115,31 +120,32 @@ export const pageRouter = router({
});
export async function updatePageFile({
- courseName,
+ courseName,
+ moduleName,
+ pageName,
+ page,
+}: {
+ courseName: string;
+ moduleName: string;
+ pageName: string;
+ page: LocalCoursePage;
+}) {
+ assertValidFileName(pageName);
+ const courseDirectory = await getCoursePathByName(courseName);
+ const folder = path.join(courseDirectory, moduleName, "pages");
+ await fs.mkdir(folder, { recursive: true });
+
+ const filePath = path.join(
+ courseDirectory,
moduleName,
- pageName,
- page,
- }: {
- courseName: string;
- moduleName: string;
- pageName: string;
- page: LocalCoursePage;
- }) {
- const courseDirectory = await getCoursePathByName(courseName);
- const folder = path.join(courseDirectory, moduleName, "pages");
- await fs.mkdir(folder, { recursive: true });
+ "pages",
+ pageName + ".md"
+ );
- const filePath = path.join(
- courseDirectory,
- moduleName,
- "pages",
- pageName + ".md"
- );
-
- const pageMarkdown = localPageMarkdownUtils.toMarkdown(page);
- console.log(`Saving page ${filePath}`);
- await fs.writeFile(filePath, pageMarkdown);
- }
+ const pageMarkdown = localPageMarkdownUtils.toMarkdown(page);
+ console.log(`Saving page ${filePath}`);
+ await fs.writeFile(filePath, pageMarkdown);
+}
async function deletePageFile({
courseName,
moduleName,
diff --git a/src/features/local/quizzes/quizRouter.ts b/src/features/local/quizzes/quizRouter.ts
index a33e010..120013f 100644
--- a/src/features/local/quizzes/quizRouter.ts
+++ b/src/features/local/quizzes/quizRouter.ts
@@ -14,6 +14,7 @@ import { promises as fs } from "fs";
import { quizMarkdownUtils } from "./models/utils/quizMarkdownUtils";
import { courseItemFileStorageService } from "../course/courseItemFileStorageService";
import { getFeedbackDelimitersFromSettings } from "../globalSettings/globalSettingsUtils";
+import { assertValidFileName } from "@/services/fileNameValidation";
export const quizRouter = router({
getQuiz: publicProcedure
@@ -153,6 +154,7 @@ export async function updateQuizFile({
quizName: string;
quiz: LocalQuiz;
}) {
+ assertValidFileName(quizName);
const courseDirectory = await getCoursePathByName(courseName);
const folder = path.join(courseDirectory, moduleName, "quizzes");
await fs.mkdir(folder, { recursive: true });
diff --git a/src/services/fileNameValidation.ts b/src/services/fileNameValidation.ts
new file mode 100644
index 0000000..b3068a5
--- /dev/null
+++ b/src/services/fileNameValidation.ts
@@ -0,0 +1,28 @@
+export function validateFileName(fileName: string): string {
+ if (!fileName || fileName.trim() === "") {
+ return "Name cannot be empty";
+ }
+
+ const invalidChars = [":", "/", "\\", "*", "?", '"', "<", ">", "|"];
+
+ for (const char of fileName) {
+ if (invalidChars.includes(char)) {
+ return `Name contains invalid character: "${char}". Please avoid: ${invalidChars.join(
+ " "
+ )}`;
+ }
+ }
+
+ if (fileName !== fileName.trimEnd()) {
+ return "Name cannot end with whitespace";
+ }
+
+ return "";
+}
+
+export function assertValidFileName(fileName: string): void {
+ const error = validateFileName(fileName);
+ if (error) {
+ throw new Error(error);
+ }
+}