A Helpful Guide to Package Updates from the 2025 Team - senior-knights/course-schedulizer GitHub Wiki

Hello future team member! Welcome to the wonderful world of versioning! I don't know how much experience you'll be coming to this type of work with, so I wanted to give you some tips I wish I'd known before beginning this task.

  • You can run 'pnpm outdated' on the command line for a full list of packages that need updating. If there are any not on this list, they are probably minor versions that can be updated without a problem. If you try to update something and you get a new problem, add it to this page!
  • Don't forget to test everything thoroughly before pushing it to GitHub. It is possible to create problems that change the program's behavior without generating error messages.
  • The instructions to get started with migrating @material/ui to @mui are here. This should be a priority because in the long term we don't want to keep using the deprecated version when the new version has already been identified and installed.
  • Don't forget to delete the pnpm-lock.yaml or package-lock.json before running 'pnpm install' every time.
  • DON'T delete packages.json. If you do this by accident, it's ok: go to the VSCode version control panel and undo the deletion (or use ctrl+z if your computer lets you).

Good luck! I hope this is a valuable experience for you. It can be frustrating at times, but it's very important work, and untangling legacy code is a good skill to have!

Package Working Version Latest Error Msgs
@material-ui/core N/A Deprecated None: It's Deprecated
@material-ui/lab N/A Deprecated None: It's Deprecated
@mui/styles N/A Deprecated None: It's Deprecated (Functionalities in this package have probably been moved to @mui/styled-engine or @mui/core)
@hookform/resolvers 1.3.8 4.1.3
  1. "export 'set' (imported as 't') was not found in 'react-hook-form' (possible exports: Controller, FormProvider, appendErrors, get, transformToNestObject, useController, useFieldArray, useForm, useFormContext, useWatch)" (3 times in resolvers.mjs)
  2. Resolver values are incompatible in AddNonTeachingLoadPopover.tsx and AddSectionPopover.tsx ("type 'undefined' is not assignable to type 'string'", "type 'string' is not assignabe to type 'number'")
    1. UPDATE: Dealing with the first type of error requires updating the package react-hook-form. As you can see further down this list, updating react-hook-form generates a variety of new problems. This package is no longer being updated during the Spring 2025 semester.
@testing-library/jest-dom 4.2.4 6.6.3 No errors when the program is compiled and run, but committing and pushing with this package updated causes GitHub tests to fail (see commits 05a12be8f9b8aee20b813f5febf6bf2b090e5a17, a71d86501d441a5769dfefec37dfba09e0f2237e, and 712914c82de03a4d24be55d00b52fe5f3da2b4cd).
@types/react 16.14.62 19.0.12
  1. "Property 'children' does not exist on type 'IntrinsicAttributes & AnimatedProps'" (Twice in AnimatedShowAndHide.tsx and once in Spring3DHover.tsx)
  2. "TS7031: Binding element 'x' [and 'y' in a separate message] implicitly has an 'any' type." (from line 32 of Spring3DHover.tsx: "onMouseMove={({ clientX: x, clientY: y }) => {")
  3. "Type '{ children: Element; }' has no properties in common with type 'IntrinsicAttributes'' (in Schedule.tsx and Tabs.tsx)
  4. "Property 'defaultProps' does not exist on type 'ForwardRefExoticComponent<Omit<any, "ref"> & RefAttributes>'" (in makeFC.tsx).
  5. "Cannot find namespace 'JSX'. (in makeFC.tsx and utils.ts)"
@types/react-dom 18.3.5 19.0.4 "Property 'render' does not exist on type 'typeof import("C:/Users/Noelle Haviland/course-schedulizer/client-course-schedulizer/node_modules/.pnpm/@types+react-dom@19.0.4_@types[email protected]/node_modules/@types/react-dom/index")'" i.e. one module is missing (fixable?)
eslint 8.57.1 9.23.0 "Error: Child compilation failed: [eslint] Invalid Options:
  • Unknown options: extensions, resolvePluginsRelativeTo
  • 'extensions' has been removed.
  • 'resolvePluginsRelativeTo' has been removed.
  • child-compiler.js:174 [client-course-schedulizer]/[[email protected][email protected]]/[html-webpack-plugin]/lib/child-compiler.js:174:18
  • Compiler.js:625 finalCallback [client-course-schedulizer]/[[email protected]]/[webpack]/lib/Compiler.js:625:5
  • Compiler.js:660 [client-course-schedulizer]/[[email protected]]/[webpack]/lib/Compiler.js:660:11
  • Compiler.js:1349 [client-course-schedulizer]/[[email protected]]/[webpack]/lib/Compiler.js:1349:17
  • task_queues:95 process.processTicksAndRejections node:internal/process/task_queues:95:5"
  • FURTHER NOTE: It looks like our whole ESLint configuration is outdated. According to eslint.org, the eslintrc configuration format is deprecated. The official instructions for configuring an eslint.config.ts file from eslint.org are here
eslint-config-prettier 7.2.0 10.1.1 "[eslint] Package subpath './@typescript-eslint' is not defined by "exports" in C:\Users\Noelle Haviland\course-schedulizer\client-course-schedulizer\node_modules\eslint-config-prettier\package.json Referenced from: C:\Users\Noelle Haviland\course-schedulizer\client-course-schedulizer.eslintrc.js"
immer 9.0.21 10.1.1
  1. "export 'default' (imported as 'produce') was not found in 'immer' (possible exports: Immer, applyPatches, castDraft, castImmutable, createDraft, current, enableMapSet, enablePatches, finishDraft, freeze, immerable, isDraft, isDraftable, nothing, original, produce, produceWithPatches, setAutoFreeze, setUseStrictShallowCopy)" (in immer.ts)
  2. "TS2349: This expression is not callable. Type 'typeof import("C:/Users/Noelle Haviland/course-schedulizer/client-course-schedulizer/node_modules/.pnpm/[email protected]/node_modules/immer/dist/immer")' has no call signatures." (also from immer.ts; the expression in question is "return config((fn) => {return set(produce(fn));},")
react 18.3.1 19.0.0 "Cannot read properties of undefined (reading 'ReactCurrentDispatcher') TypeError: Cannot read properties of undefined (reading 'ReactCurrentDispatcher')
react-dom 18.3.1 19.0.0 The error "export 'findDOMNode' (imported as 'ReactDOM') was not found in 'react-dom' (possible exports: __DOM_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, createPortal, flushSync, preconnect, prefetchDNS, preinit, preinitModule, preload, preloadModule, requestFormReset, unstable_batchedUpdates, useFormState, useFormStatus, version)" appears in 15 different files. (one missing module again?)
react-hook-form 6.15.8 7.54.2
  1. "Type '{ as: Element; control: any; defaultValue: any; name: ${any}[${number}][${string}]; }' is not assignable to type 'IntrinsicAttributes & { render: ({ field, fieldState, formState, }: { field: ControllerRenderProps<FieldValues, ${any}[${number}][${string}]>; fieldState: ControllerFieldState; formState: UseFormStateReturn<...>; }) => ReactElement<...>; } & UseControllerProps<...>'. Property 'as' does not exist on type 'IntrinsicAttributes & { render: ({ field, fieldState, formState, }: { field: ControllerRenderProps<FieldValues, ${any}[${number}][${string}]>; fieldState: ControllerFieldState; formState: UseFormStateReturn<...>; }) => ReactElement<...>; } & UseControllerProps<...>'." (from FieldArrayField.tsx)
  2. "export 'transformToNestObject' (imported as 'e') was not found in 'react-hook-form' (possible exports: Controller, Form, FormProvider, appendErrors, get, set, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch)" (from yup.module.js)
  3. "Parameter 'field' [and "Parameter 'index'"] implicitly has an 'any' type." (in FieldArrayFields.tsx)
  4. "Property 'errors' does not exist on type 'UseFormReturn<FieldValues, any, undefined>'." (in GridItemAutocomplete.tsx)
  5. "Type '{ control: Control<FieldValues, any>; defaultValue: string[] [or] undefined; name: string; onChange: ([, data]: [unknown, unknown]) => unknown; render: ({ onChange, ...controllerProps }: { field: ControllerRenderProps<FieldValues, string>; fieldState: ControllerFieldState; formState: UseFormStateReturn<...>; }) => Elem...' is not assignable to type 'IntrinsicAttributes & { render: ({ field, fieldState, formState, }: { field: ControllerRenderProps<FieldValues, string>; fieldState: ControllerFieldState; formState: UseFormStateReturn<...>; }) => ReactElement<...>; } & UseControllerProps<...>'. Property 'onChange' does not exist on type 'IntrinsicAttributes & { render: ({ field, fieldState, formState, }: { field: ControllerRenderProps<FieldValues, string>; fieldState: ControllerFieldState; formState: UseFormStateReturn<...>; }) => ReactElement<...>; } & UseControllerProps<...>'." (in GridItemAutocomplete.tsx)
  6. "Property 'onChange' [and "Property 'value'"] does not exist on type '{ field: ControllerRenderProps<FieldValues, string>; fieldState: ControllerFieldState; formState: UseFormStateReturn; }'." (from GridItemAutocomplete)
  7. "Property 'errors' does not exist on type 'UseFormReturn<FieldValues, any, undefined>'." (in GridItemCheckboxGroup.tsx)
  8. "Type 'keyof T' cannot be used to index type 'DeepMap<T, FieldError>'." (from addSectionHooks.ts)
  9. "'"react-hook-form"' has no exported member named 'UseFieldArrayMethods'. Did you mean 'FieldArrayMethodProps'?" (in fieldArrayTypes.ts)</li
  10. "Module '"react-hook-form"' has no exported member 'UseFormMethods'." (from fieldArrayTypes.ts)
react-router-dom 5.3.4 7.4.0
  1. "export 'Switch' [and "export 'useHistory'"] (imported as 'Switch') was not found in 'react-router-dom'" (in App.tsx and useRedirect.tsx)
  2. "Module '"react-router-dom"' has no exported member 'Switch'." (in App.tsx)
runtypes 6.7.0 7.0.4 "Module '"runtypes"' has no exported member 'Case'." (in caseFunctions.ts)
  • The module "Case" isn't even being used! Fixed by commenting out the line where "Case" is imported.
typescript 4.7.4 5.8.2
  1. "Argument of type 'Day' is not assignable to parameter of type 'Weekday'. Type 'Day.Monday' is not assignable to type 'Weekday'." (from AddSectionPopover.tsx)
    • Fixed by rewriting "filter((day)..." as "filter((d as unknown as Weekday)..."
  2. "Argument of type 'SemesterLength' is not assignable to parameter of type 'Half'. Type 'SemesterLength.Full' is not assignable to type 'Half'." (in AddSectionPopover.tsx)
    • Fixed by rewriting h (for half) as "h as unknown as Half"
  3. "Argument of type 'SemesterLength' is not assignable to parameter of type 'Intensive'. Type 'SemesterLength.Full' is not assignable to type 'Intensive'." (from AddSectionPopover.tsx)
    • Fixed by rewriting i (for intensive) as "i as unknown as Intensive"
  4. "No overload matches this call. Overload 1 of 2, '(o: {}): string[]', gave the following error. Argument of type 'T' is not assignable to parameter of type '{}'. Overload 2 of 2, '(o: object): string[]', gave the following error. Argument of type 'T' is not assignable to parameter of type 'object'." (in utils.ts)
    • Fixed by adding an extension "extension {}" to <T>
  5. "Argument of type 'Day' is not assignable to parameter of type 'Weekday'. Type 'Day.Monday' is not assignable to type 'Weekday'." (in addSectionService.ts)
    • Fixed by rewriting "filter((day)..." as "filter((d as unknown as Weekday)..."
zustand 3.4.2 5.0.3
  1. "export 'default' (imported as 'create') was not found in 'zustand' (possible exports: create, createStore, useStore)" (in useHarmonyAssignmentsStore.ts, useHarmonyFormsStore.ts, useHarmonyResultStore.ts, and useHarmonyStepperCallback.ts)
  2. "Parameter 'cb' implicitly has an 'any' type." (in HarmonyStepper.tsx)
  3. "Module '"zustand"' has no exported member 'State'." (in immer.tsx)
  4. "Type '(fn: (draft: Draft) => void) => void' does not satisfy the constraint '[never, unknown][]'." (in immer.ts)
  5. "Parameter 'fn' implicitly has an 'any' type." (in immer.ts)
  6. "Module '"zustand"' has no exported member 'State'." (in HarmonyAssignmentsStore.tsx)
  7. "This expression is not callable. Type 'typeof import("C:/Users/Noelle Haviland/course-schedulizer/client-cours-schedulizer/node_modules/.pnpm/zustand@5.0.3_@types[email protected]_immer@[email protected]_use-sync-external [email protected][email protected]_/node_modules/zustand/index")' has no call signatures." The expression in question is create (in HarmonyAssignmentsStore.ts)
  8. "This expression is not callable. Type 'never' has no call signatures." The expression in question is set((state => {state.assignments = newAssignments;}) (in HarmonyAssignmentState.ts)
  9. "Module '"zustand"' has no exported member 'GetState' [or 'SetState' or 'State']." (in useHarmonyResultsStore.ts and useHarmonyStepperCallback.ts)
⚠️ **GitHub.com Fallback** ⚠️