From fb7e72436226906f3e3ce8bb1217d3dd0f01be88 Mon Sep 17 00:00:00 2001 From: ANSHUMAN TIWARI Date: Wed, 25 Mar 2026 12:10:37 +0530 Subject: [PATCH 1/3] Quiz in practice problem chip fix Fixed the quiz name display on the chip in the practice problem page --- .../alea-frontend/pages/exam-problems.tsx | 11 +++++++++ .../alea-frontend/pages/quiz-problems.tsx | 9 +++---- spec/src/lib/flams.ts | 24 ++++++++++++++----- 3 files changed, 34 insertions(+), 10 deletions(-) diff --git a/packages/alea-frontend/pages/exam-problems.tsx b/packages/alea-frontend/pages/exam-problems.tsx index 75126323d..2cec13900 100644 --- a/packages/alea-frontend/pages/exam-problems.tsx +++ b/packages/alea-frontend/pages/exam-problems.tsx @@ -19,6 +19,7 @@ import { import MainLayout from '../layouts/MainLayout'; import { contentFragment } from '@flexiformal/ftml-backend'; +import { red } from '@mui/material/colors'; async function buildFTMLProblem(problemUri: string): Promise { const fragmentResponse: any[] = await contentFragment({ uri: problemUri }); @@ -58,14 +59,19 @@ const ExamProblemsPage = () => { if (!examUri) return; const fetchData = async () => { + console.log("start fetch1234"); setLoading(true); try { const decodedUri = decodeURIComponent(examUri); + console.log("start fetch"); + const meta = await getExamMetadataByUri(decodedUri); + console.log('Meta done'); setExamMeta(meta); const uris = await getProblemsForExam(decodedUri); + console.log('Problems URIs:', uris); if (targetProblemId) { const idx = uris.indexOf(decodeURIComponent(targetProblemId)); @@ -73,10 +79,12 @@ const ExamProblemsPage = () => { } const examProblems = await buildExamProblems(uris); + console.log('Problems URIs:', uris); setProblems(examProblems); } catch (error) { console.error('Error loading exam data:', error); } finally { + console.log('Finished loading exam data'); setLoading(false); } }; @@ -94,6 +102,7 @@ const ExamProblemsPage = () => { return formatExamLabelFullFromUri(examUri, examMeta); }, [examUri, examMeta]); + console.log({loading}); if (loading) { return ( @@ -138,6 +147,8 @@ const ExamProblemsPage = () => { )} + abx + { const router = useRouter(); const quizUri = router.query.quizUri as string | undefined; + const courseId = router.query.courseId as string | undefined; const targetProblemId = router.query.problemId as string | undefined; const [quizMeta, setQuizMeta] = useState(null); @@ -86,13 +87,13 @@ const QuizProblemsPage = () => { const quizLabelShort = useMemo(() => { if (!quizUri || !quizMeta) return ''; - return formatQuizLabelShortFromUri(quizUri, quizMeta); - }, [quizUri, quizMeta]); + return formatQuizLabelShortFromUri(quizUri, quizMeta, courseId ?? quizMeta?.courseId); + }, [quizUri, quizMeta, courseId]); const quizLabelFull = useMemo(() => { if (!quizUri || !quizMeta) return ''; - return formatQuizLabelFullFromUri(quizUri, quizMeta); - }, [quizUri, quizMeta]); + return formatQuizLabelFullFromUri(quizUri, quizMeta, courseId ?? quizMeta?.courseId); + }, [quizUri, quizMeta, courseId]); if (loading) { return ( diff --git a/spec/src/lib/flams.ts b/spec/src/lib/flams.ts index 1c04fa2ca..5beff7eb7 100644 --- a/spec/src/lib/flams.ts +++ b/spec/src/lib/flams.ts @@ -529,11 +529,23 @@ export function getQuizMetaFromQuizUri( number?: string; date?: string; courseId?: string; - } + }, + courseId?: string ): QuizMeta { const decoded = decodeURIComponent(quizUri); - const courseAcronym = quiz?.courseId?.toUpperCase() ?? 'UNKNOWN'; + let courseAcronym = 'UNKNOWN'; + + if (courseId) { + courseAcronym = courseId.toUpperCase(); + } else if (quiz?.courseId) { + courseAcronym = quiz.courseId.toUpperCase(); + } else { + const match = decoded.match(/courses\/[^/]+\/([^/]+)/); + if (match && match[1]) { + courseAcronym = match[1].toUpperCase(); + } + } const rawTerm = quiz?.term ?? ''; const formattedTerm = rawTerm.replace(/([A-Z]+)(\d{2})(\d{2})/, '$1 $2/$3'); @@ -550,14 +562,14 @@ export function getQuizMetaFromQuizUri( }; } -export function formatQuizLabelShortFromUri(quizUri: string, quiz?: any) { - const meta = getQuizMetaFromQuizUri(quizUri, quiz); +export function formatQuizLabelShortFromUri(quizUri: string, quiz?: any, courseId?: string) { + const meta = getQuizMetaFromQuizUri(quizUri, quiz, courseId); return [meta.courseAcronym, meta.quizNumber, meta.formattedTerm].filter(Boolean).join(' '); } -export function formatQuizLabelFullFromUri(quizUri: string, quiz?: any) { - const meta = getQuizMetaFromQuizUri(quizUri, quiz); +export function formatQuizLabelFullFromUri(quizUri: string, quiz?: any, courseId?: string) { + const meta = getQuizMetaFromQuizUri(quizUri, quiz, courseId); return [ meta.courseAcronym, From 0978f7681543ab3db9c85e14fd9c08ec8eb8fd94 Mon Sep 17 00:00:00 2001 From: ANSHUMAN TIWARI Date: Tue, 31 Mar 2026 12:17:25 +0530 Subject: [PATCH 2/3] fixed the ui in the practice problem page corrected the dropdown colour and also text colours which were displayed in both of the modes --- .../alea-frontend/components/ProblemList.tsx | 2 +- packages/alea-frontend/theme/components.ts | 144 +++++++++--------- .../src/lib/ExamSelect.tsx | 2 +- 3 files changed, 73 insertions(+), 75 deletions(-) diff --git a/packages/alea-frontend/components/ProblemList.tsx b/packages/alea-frontend/components/ProblemList.tsx index 1eb7d8938..eaac24e72 100644 --- a/packages/alea-frontend/components/ProblemList.tsx +++ b/packages/alea-frontend/components/ProblemList.tsx @@ -188,7 +188,7 @@ const ProblemList: FC = ({ courseSections, courseId }) => { > Old exams are great practice resources, but since exam styles evolve, recent exams are better models, and any course topic even if not asked before can still appear in upcoming diff --git a/packages/alea-frontend/theme/components.ts b/packages/alea-frontend/theme/components.ts index 857b5aacc..04b53ebcf 100644 --- a/packages/alea-frontend/theme/components.ts +++ b/packages/alea-frontend/theme/components.ts @@ -97,7 +97,7 @@ const components: Components = { const isDark = theme.palette.mode === 'dark'; return { - backgroundColor: theme.palette.background.paper, + backgroundColor: theme.palette.background.default, borderRadius: 10, '&:hover .MuiOutlinedInput-notchedOutline': { @@ -121,98 +121,96 @@ const components: Components = { }, }, }, -MuiTextField: { - defaultProps: { - variant: 'outlined', - }, - styleOverrides: { - root: ({ theme }:{theme:any}) => { - const isDark = theme.palette.mode === 'dark'; + MuiTextField: { + defaultProps: { + variant: 'outlined', + }, + styleOverrides: { + root: ({ theme }: { theme: any }) => { + const isDark = theme.palette.mode === 'dark'; - return { - '& .MuiOutlinedInput-root': { - borderRadius: 10, - backgroundColor: theme.palette.background.paper, + return { + '& .MuiOutlinedInput-root': { + borderRadius: 10, + backgroundColor: theme.palette.background.default, - '& .MuiOutlinedInput-notchedOutline': { - borderColor: isDark - ? theme.palette.primary.main:theme.palette.divider, - }, + '& .MuiOutlinedInput-notchedOutline': { + borderColor: isDark ? theme.palette.primary.main : theme.palette.divider, + }, - '&:hover .MuiOutlinedInput-notchedOutline': { - borderColor: isDark - ? theme.palette.primary.light - : theme.palette.primary.main, - }, + '&:hover .MuiOutlinedInput-notchedOutline': { + borderColor: isDark ? theme.palette.primary.light : theme.palette.primary.main, + }, - '&.Mui-focused .MuiOutlinedInput-notchedOutline': { - borderColor: theme.palette.primary.main, + '&.Mui-focused .MuiOutlinedInput-notchedOutline': { + borderColor: theme.palette.primary.main, + }, }, - }, - }; + }; + }, }, }, -}, MuiInputLabel: { - styleOverrides: { - root: ({ theme }:{theme:any}) => ({ - color: theme.palette.text.secondary, - - '&.Mui-focused': { + styleOverrides: { + root: ({ theme }: { theme: any }) => ({ color: theme.palette.text.primary, - }, - }), + + '&.Mui-focused': { + color: theme.palette.text.primary.main, + }, + }), + }, }, -}, -MuiSelect: { - styleOverrides: { - select: ({ theme }:{theme:any}) => ({ - color: theme.palette.text.primary, - }), + MuiSelect: { + styleOverrides: { + select: ({ theme }: { theme: any }) => ({ + color: theme.palette.text.primary, + }), - icon: ({ theme }:{theme:any}) => ({ - color: theme.palette.text.secondary, - }), + icon: ({ theme }: { theme: any }) => ({ + color: theme.palette.text.secondary, + }), + }, }, -}, - -MuiAutocomplete: { - styleOverrides: { - paper: ({ theme }:{theme:any}) => ({ - borderRadius: 10, - backgroundColor: theme.palette.background.paper, - color: theme.palette.text.primary, - borderColor: theme.palette.primary.main, - }), - inputRoot: ({ theme }:{theme:any}) => { - const isDark = theme.palette.mode === 'dark'; - - return({ - borderRadius: 10, - - '& .MuiOutlinedInput-notchedOutline': { - borderColor: isDark?theme.palette.primary.main:theme.palette.divider, - }, - '&.Mui-focused .MuiOutlinedInput-notchedOutline': { + MuiAutocomplete: { + styleOverrides: { + paper: ({ theme }: { theme: any }) => ({ + borderRadius: 10, + backgroundColor: theme.palette.background.paper, + color: theme.palette.text.primary, borderColor: theme.palette.primary.main, - borderWidth: 1.5, - }, - })}, + }), + inputRoot: ({ theme }: { theme: any }) => { + const isDark = theme.palette.mode === 'dark'; - option: ({ theme }:{theme:any}) => ({ - '&[aria-selected="true"]': { - backgroundColor: theme.palette.action.selected, - }, + return { + borderRadius: 10, + + '& .MuiOutlinedInput-notchedOutline': { + borderColor: isDark ? theme.palette.primary.main : theme.palette.divider, + }, - '&.Mui-focused': { - backgroundColor: theme.palette.action.hover, + '&.Mui-focused .MuiOutlinedInput-notchedOutline': { + borderColor: theme.palette.primary.main, + borderWidth: 1.5, + }, + }; }, - }), + + option: ({ theme }: { theme: any }) => ({ + '&[aria-selected="true"]': { + backgroundColor: theme.palette.action.selected, + }, + + '&.Mui-focused': { + backgroundColor: theme.palette.action.hover, + }, + }), + }, }, -}, MuiDialog: { styleOverrides: { diff --git a/packages/stex-react-renderer/src/lib/ExamSelect.tsx b/packages/stex-react-renderer/src/lib/ExamSelect.tsx index 2bde0ecc0..f7ad0286f 100644 --- a/packages/stex-react-renderer/src/lib/ExamSelect.tsx +++ b/packages/stex-react-renderer/src/lib/ExamSelect.tsx @@ -53,7 +53,7 @@ export function ExamSelect({ return ( - + {dropdownLabel} From 659a2960b346e74a53c2bd37e6d24957065730c4 Mon Sep 17 00:00:00 2001 From: ANSHUMAN TIWARI Date: Tue, 31 Mar 2026 12:34:16 +0530 Subject: [PATCH 3/3] minor --- packages/alea-frontend/pages/exam-problems.tsx | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/packages/alea-frontend/pages/exam-problems.tsx b/packages/alea-frontend/pages/exam-problems.tsx index 2cec13900..d268800ac 100644 --- a/packages/alea-frontend/pages/exam-problems.tsx +++ b/packages/alea-frontend/pages/exam-problems.tsx @@ -19,7 +19,6 @@ import { import MainLayout from '../layouts/MainLayout'; import { contentFragment } from '@flexiformal/ftml-backend'; -import { red } from '@mui/material/colors'; async function buildFTMLProblem(problemUri: string): Promise { const fragmentResponse: any[] = await contentFragment({ uri: problemUri }); @@ -59,19 +58,14 @@ const ExamProblemsPage = () => { if (!examUri) return; const fetchData = async () => { - console.log("start fetch1234"); setLoading(true); try { const decodedUri = decodeURIComponent(examUri); - console.log("start fetch"); - const meta = await getExamMetadataByUri(decodedUri); - console.log('Meta done'); setExamMeta(meta); const uris = await getProblemsForExam(decodedUri); - console.log('Problems URIs:', uris); if (targetProblemId) { const idx = uris.indexOf(decodeURIComponent(targetProblemId)); @@ -79,7 +73,6 @@ const ExamProblemsPage = () => { } const examProblems = await buildExamProblems(uris); - console.log('Problems URIs:', uris); setProblems(examProblems); } catch (error) { console.error('Error loading exam data:', error); @@ -102,7 +95,6 @@ const ExamProblemsPage = () => { return formatExamLabelFullFromUri(examUri, examMeta); }, [examUri, examMeta]); - console.log({loading}); if (loading) { return ( @@ -147,8 +139,6 @@ const ExamProblemsPage = () => { )} - abx -