diff --git a/.eslintrc.json b/.eslintrc.json
index 8c2331ab88..727fd51ac7 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -2,6 +2,22 @@
   "extends": ["react-app", "plugin:@typescript-eslint/recommended"],
   "plugins": ["simple-import-sort"],
   "rules": {
+    "no-restricted-imports": [
+      "error",
+      {
+        "paths": [
+          {
+            "name": "react-redux",
+            "importNames": [
+              // TODO: Create typed hook for useDispatch
+              // "useDispatch",
+              "useSelector"
+            ],
+            "message": "Use the typed hook \"useTypedSelector\" instead."
+          }
+        ]
+      }
+    ],
     "@typescript-eslint/no-empty-function": "off",
     "@typescript-eslint/interface-name-prefix": "off",
     "@typescript-eslint/camelcase": "off",
@@ -11,7 +27,19 @@
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/explicit-module-boundary-types": "off",
     "@typescript-eslint/ban-ts-comment": "warn",
-    "@typescript-eslint/ban-types": "off",
+    "@typescript-eslint/ban-types": [
+      "error",
+      {
+        // TODO: Change this to true someday
+        "extendDefaults": false,
+        "types": {
+          "React.FunctionComponent": {
+            "message": "Use React.FC instead",
+            "fixWith": "React.FC"
+          }
+        }
+      }
+    ],
     "simple-import-sort/imports": "error"
   }
 }
diff --git a/src/assets/PortSvg.tsx b/src/assets/PortSvg.tsx
index faeecd00f0..bdaf749c70 100644
--- a/src/assets/PortSvg.tsx
+++ b/src/assets/PortSvg.tsx
@@ -1,8 +1,10 @@
+import React from 'react';
+
 type Props = {
   port: string;
 };
 
-const PortSvg = ({ port }: Props) => (
+const PortSvg: React.FC<Props> = ({ port }) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
     id="port-svg6348"
diff --git a/src/commons/ControlButton.tsx b/src/commons/ControlButton.tsx
index 3e2a118c63..ac3f2b30d9 100644
--- a/src/commons/ControlButton.tsx
+++ b/src/commons/ControlButton.tsx
@@ -11,14 +11,6 @@ type ButtonOptions = {
   type?: 'submit' | 'reset' | 'button';
 };
 
-type ControlButtonProps = {
-  label?: string;
-  icon?: IconName;
-  onClick?: () => void;
-  options?: Partial<ButtonOptions>;
-  isDisabled?: boolean;
-};
-
 const defaultOptions = {
   className: '',
   fullWidth: false,
@@ -27,7 +19,15 @@ const defaultOptions = {
   minimal: true
 };
 
-const ControlButton: React.FC<ControlButtonProps> = ({
+type Props = {
+  label?: string;
+  icon?: IconName;
+  onClick?: () => void;
+  options?: Partial<ButtonOptions>;
+  isDisabled?: boolean;
+};
+
+const ControlButton: React.FC<Props> = ({
   label = '',
   icon,
   onClick,
diff --git a/src/commons/Markdown.tsx b/src/commons/Markdown.tsx
index b19821f5ed..ea324f00a6 100644
--- a/src/commons/Markdown.tsx
+++ b/src/commons/Markdown.tsx
@@ -3,7 +3,7 @@ import classNames from 'classnames';
 import React from 'react';
 import { Converter } from 'showdown';
 
-type MarkdownProps = {
+type Props = {
   className?: string;
   content: string;
   openLinksInNewWindow?: boolean;
@@ -12,7 +12,7 @@ type MarkdownProps = {
   tasklists?: boolean;
 };
 
-const Markdown: React.FC<MarkdownProps> = props => {
+const Markdown: React.FC<Props> = props => {
   const converter = new Converter({
     tables: true,
     simplifiedAutoLink: props.simplifiedAutoLink,
diff --git a/src/commons/SimpleDropdown.tsx b/src/commons/SimpleDropdown.tsx
index c68c9872fd..6aca5c2668 100644
--- a/src/commons/SimpleDropdown.tsx
+++ b/src/commons/SimpleDropdown.tsx
@@ -10,9 +10,13 @@ type Props<T extends OptionType> = {
   popoverProps?: Partial<React.ComponentProps<typeof Popover2>>;
 };
 
-function SimpleDropdown<T extends OptionType>(props: Props<T>) {
-  const { options, selectedValue, onClick, buttonProps, popoverProps } = props;
-
+const SimpleDropdown = <T extends OptionType>({
+  options,
+  selectedValue,
+  onClick,
+  buttonProps,
+  popoverProps
+}: Props<T>) => {
   const handleClick = (value: T['value']) => {
     onClick?.(value);
   };
@@ -37,6 +41,6 @@ function SimpleDropdown<T extends OptionType>(props: Props<T>) {
       <Button {...buttonProps}>{buttonLabel()}</Button>
     </Popover2>
   );
-}
+};
 
 export default SimpleDropdown;
diff --git a/src/commons/__tests__/ContentDisplay.tsx b/src/commons/__tests__/ContentDisplay.tsx
index 307367c118..bf3138083c 100644
--- a/src/commons/__tests__/ContentDisplay.tsx
+++ b/src/commons/__tests__/ContentDisplay.tsx
@@ -2,8 +2,7 @@ import ContentDisplay, { ContentDisplayProps } from '../ContentDisplay';
 import { renderTreeJson } from '../utils/TestUtils';
 
 const mockProps: ContentDisplayProps = {
-  display: <div> Test Content </div>,
-  loadContentDispatch: () => {}
+  display: <div> Test Content </div>
 };
 
 test('ContentDisplay page renders correctly', () => {
diff --git a/src/commons/achievement/AchievementCard.tsx b/src/commons/achievement/AchievementCard.tsx
index bf68d6adec..7db9ddc9b2 100644
--- a/src/commons/achievement/AchievementCard.tsx
+++ b/src/commons/achievement/AchievementCard.tsx
@@ -7,7 +7,7 @@ import { AchievementStatus } from '../../features/achievement/AchievementTypes';
 import AchievementDeadline from './card/AchievementDeadline';
 import AchievementXp from './card/AchievementXp';
 
-type AchievementCardProps = {
+type Props = {
   uuid: string;
   focusState: [string, any];
   isDropdownOpen?: boolean;
@@ -15,9 +15,13 @@ type AchievementCardProps = {
   toggleDropdown?: () => void;
 };
 
-const AchievementCard: React.FC<AchievementCardProps> = props => {
-  const { uuid, focusState, isDropdownOpen, shouldRender, toggleDropdown } = props;
-
+const AchievementCard: React.FC<Props> = ({
+  uuid,
+  focusState,
+  isDropdownOpen,
+  shouldRender,
+  toggleDropdown
+}) => {
   const inferencer = useContext(AchievementContext);
 
   const [focusUuid, setFocusUuid] = focusState;
diff --git a/src/commons/achievement/AchievementCommentCard.tsx b/src/commons/achievement/AchievementCommentCard.tsx
index ae259c2650..42255758a9 100644
--- a/src/commons/achievement/AchievementCommentCard.tsx
+++ b/src/commons/achievement/AchievementCommentCard.tsx
@@ -7,10 +7,12 @@ import { useTypedSelector } from '../utils/Hooks';
 import { showWarningMessage } from '../utils/notifications/NotificationsHelper';
 import { assessmentTypeLink } from '../utils/ParamParseHelper';
 
-const AchievementCommentCard: React.FC<{
+type Props = {
   assessment: Assessment;
   showToQuestion: boolean;
-}> = ({ assessment, showToQuestion }) => {
+};
+
+const AchievementCommentCard: React.FC<Props> = ({ assessment, showToQuestion }) => {
   const navigate = useNavigate();
   const courseId = useTypedSelector(store => store.session.courseId);
   const toMission = useMemo(
diff --git a/src/commons/achievement/AchievementFilter.tsx b/src/commons/achievement/AchievementFilter.tsx
index d63dabcc95..47c34718a0 100644
--- a/src/commons/achievement/AchievementFilter.tsx
+++ b/src/commons/achievement/AchievementFilter.tsx
@@ -4,13 +4,13 @@ import React from 'react';
 import { getFilterColor } from '../../features/achievement/AchievementConstants';
 import { FilterStatus } from '../../features/achievement/AchievementTypes';
 
-type AchievementFilterProps = {
+type Props = {
   filterState: [FilterStatus, any];
   icon: IconName;
   ownStatus: FilterStatus;
 };
 
-const AchievementFilter: React.FC<AchievementFilterProps> = ({ filterState, icon, ownStatus }) => {
+const AchievementFilter: React.FC<Props> = ({ filterState, icon, ownStatus }) => {
   const [globalStatus, setGlobalStatus] = filterState;
 
   return (
diff --git a/src/commons/achievement/AchievementManualEditor.tsx b/src/commons/achievement/AchievementManualEditor.tsx
index 859eee93bb..456f1956b9 100644
--- a/src/commons/achievement/AchievementManualEditor.tsx
+++ b/src/commons/achievement/AchievementManualEditor.tsx
@@ -10,15 +10,6 @@ import {
 
 import { showSuccessMessage, showWarningMessage } from '../utils/notifications/NotificationsHelper';
 
-type AchievementManualEditorProps = {
-  hiddenState: [boolean, any];
-  userState: [AchievementUser | undefined, any];
-  studio: string;
-  users: AchievementUser[];
-  getUsers: () => void;
-  updateGoalProgress: (studentCourseRegId: number, progress: GoalProgress) => void;
-};
-
 const GoalSelect = Select.ofType<AchievementGoal>();
 const goalRenderer: ItemRenderer<AchievementGoal> = (goal, { handleClick }) => (
   <MenuItem key={goal.uuid} onClick={handleClick} text={goal.text} />
@@ -40,7 +31,16 @@ export function updateGoalProcessed() {
   showSuccessMessage('Goal updated');
 }
 
-const AchievementManualEditor: React.FC<AchievementManualEditorProps> = props => {
+type Props = {
+  hiddenState: [boolean, any];
+  userState: [AchievementUser | undefined, any];
+  studio: string;
+  users: AchievementUser[];
+  getUsers: () => void;
+  updateGoalProgress: (studentCourseRegId: number, progress: GoalProgress) => void;
+};
+
+const AchievementManualEditor: React.FC<Props> = props => {
   const { userState, hiddenState, studio, getUsers, updateGoalProgress } = props;
   const users =
     studio === 'Staff'
@@ -75,7 +75,7 @@ const AchievementManualEditor: React.FC<AchievementManualEditorProps> = props =>
 
   const [goal, changeGoal] = useState<AchievementGoal | undefined>(undefined);
   const [selectedUser, changeSelectedUser] = userState;
-  const [count, changeCount] = useState<number>(0);
+  const [count, changeCount] = useState(0);
   const [viewHidden, changeViewHidden] = hiddenState;
 
   const updateGoal = () => {
diff --git a/src/commons/achievement/AchievementOverview.tsx b/src/commons/achievement/AchievementOverview.tsx
index f535043ef5..0bcbee3b35 100644
--- a/src/commons/achievement/AchievementOverview.tsx
+++ b/src/commons/achievement/AchievementOverview.tsx
@@ -6,12 +6,12 @@ import { FETCH_TOTAL_XP, FETCH_TOTAL_XP_ADMIN } from '../application/types/Sessi
 import { useTypedSelector } from '../utils/Hooks';
 import AchievementLevel from './overview/AchievementLevel';
 
-type AchievementOverviewProps = {
+type Props = {
   name: string;
   userState: [AchievementUser | undefined, any];
 };
 
-const AchievementOverview: React.FC<AchievementOverviewProps> = ({ name, userState }) => {
+const AchievementOverview: React.FC<Props> = ({ name, userState }) => {
   const [selectedUser] = userState;
   const crid = selectedUser?.courseRegId;
   const userCrid = useTypedSelector(store => store.session.courseRegId);
diff --git a/src/commons/achievement/AchievementTask.tsx b/src/commons/achievement/AchievementTask.tsx
index ef339823ce..6b23aeaae5 100644
--- a/src/commons/achievement/AchievementTask.tsx
+++ b/src/commons/achievement/AchievementTask.tsx
@@ -8,18 +8,18 @@ import {
 import { AchievementStatus, FilterStatus } from '../../features/achievement/AchievementTypes';
 import AchievementCard from './AchievementCard';
 
-type AchievementTaskProps = {
+type Props = {
   uuid: string;
   filterStatus: FilterStatus;
   focusState: [string, any];
 };
 
-const AchievementTask: React.FC<AchievementTaskProps> = ({ uuid, filterStatus, focusState }) => {
+const AchievementTask: React.FC<Props> = ({ uuid, filterStatus, focusState }) => {
   const inferencer = useContext(AchievementContext);
   const prerequisiteUuids = [...inferencer.getImmediateChildren(uuid)];
   const taskColor = getAbilityColor();
 
-  const [isDropdownOpen, setIsDropdownOpen] = useState<boolean>(false);
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
   const toggleDropdown = () => setIsDropdownOpen(!isDropdownOpen);
 
   /**
diff --git a/src/commons/achievement/AchievementView.tsx b/src/commons/achievement/AchievementView.tsx
index 7ed9361097..01ef0864bf 100644
--- a/src/commons/achievement/AchievementView.tsx
+++ b/src/commons/achievement/AchievementView.tsx
@@ -17,13 +17,13 @@ import { prettifyDate } from './utils/DateHelper';
 import AchievementViewCompletion from './view/AchievementViewCompletion';
 import AchievementViewGoal from './view/AchievementViewGoal';
 
-type AchievementViewProps = {
+type Props = {
   focusUuid: string;
   assessments?: Map<number, Assessment>;
   userState?: [AchievementUser | undefined, any];
 };
 
-const AchievementView: React.FC<AchievementViewProps> = ({ focusUuid, userState }) => {
+const AchievementView: React.FC<Props> = ({ focusUuid, userState }) => {
   const assessmentId = !Number.isNaN(+focusUuid) && +focusUuid !== 0 ? +focusUuid : undefined;
   let courseRegId: number | undefined;
 
diff --git a/src/commons/achievement/card/AchievementDeadline.tsx b/src/commons/achievement/card/AchievementDeadline.tsx
index d1f313bb03..6ebf56a22c 100644
--- a/src/commons/achievement/card/AchievementDeadline.tsx
+++ b/src/commons/achievement/card/AchievementDeadline.tsx
@@ -5,13 +5,13 @@ import React from 'react';
 import { DeadlineColors } from '../../../features/achievement/AchievementConstants';
 import { isExpired, prettifyDeadline, timeFromExpired } from '../utils/DateHelper';
 
-type AchievementDeadlineProps = {
+const twoDays = new Date(0, 0, 2).getTime() - new Date(0, 0, 0).getTime();
+
+type Props = {
   deadline?: Date;
 };
 
-const twoDays = new Date(0, 0, 2).getTime() - new Date(0, 0, 0).getTime();
-
-const AchievementDeadline: React.FC<AchievementDeadlineProps> = ({ deadline }) => {
+const AchievementDeadline: React.FC<Props> = ({ deadline }) => {
   // red deadline color for core achievements that are expiring in less than 2 days
   const deadlineColor =
     deadline !== undefined && !isExpired(deadline) && timeFromExpired(deadline) <= twoDays
diff --git a/src/commons/achievement/card/AchievementXp.tsx b/src/commons/achievement/card/AchievementXp.tsx
index 46db34b621..18338e8e32 100644
--- a/src/commons/achievement/card/AchievementXp.tsx
+++ b/src/commons/achievement/card/AchievementXp.tsx
@@ -2,16 +2,16 @@ import { Icon } from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
 import React from 'react';
 
-type AchievementXpProps = {
-  isBonus: boolean;
-  xp: number;
-};
-
 const stringifyXp = (xp: number, isBonus: boolean) => {
   return (isBonus ? 'Total ' : '') + xp + ' XP';
 };
 
-const AchievementXp: React.FC<AchievementXpProps> = ({ isBonus, xp }) => {
+type Props = {
+  isBonus: boolean;
+  xp: number;
+};
+
+const AchievementXp: React.FC<Props> = ({ isBonus, xp }) => {
   return (
     <div className="xp">
       {xp !== 0 && (
diff --git a/src/commons/achievement/control/AchievementEditor.tsx b/src/commons/achievement/control/AchievementEditor.tsx
index 4f477138be..9388ff6972 100644
--- a/src/commons/achievement/control/AchievementEditor.tsx
+++ b/src/commons/achievement/control/AchievementEditor.tsx
@@ -4,13 +4,13 @@ import { AchievementContext } from 'src/features/achievement/AchievementConstant
 import AchievementAdder from './achievementEditor/AchievementAdder';
 import EditableCard from './achievementEditor/EditableCard';
 
-type AchievementEditorProps = {
+let editableCards: JSX.Element[] = [];
+
+type Props = {
   requestPublish: () => void;
 };
 
-let editableCards: JSX.Element[] = [];
-
-const AchievementEditor: React.FC<AchievementEditorProps> = ({ requestPublish }) => {
+const AchievementEditor: React.FC<Props> = ({ requestPublish }) => {
   const inferencer = useContext(AchievementContext);
 
   /**
@@ -24,7 +24,7 @@ const AchievementEditor: React.FC<AchievementEditorProps> = ({ requestPublish })
    * at one go. The newUuid holds the newly created achievement uuid until the new achievement
    * is added into the inferencer.
    */
-  const [newUuid, setNewUuid] = useState<string>('');
+  const [newUuid, setNewUuid] = useState('');
   const allowNewUuid = newUuid === '';
   const releaseUuid = () => setNewUuid('');
 
diff --git a/src/commons/achievement/control/AchievementPreview.tsx b/src/commons/achievement/control/AchievementPreview.tsx
index 62e5ca019b..1e3c9023f3 100644
--- a/src/commons/achievement/control/AchievementPreview.tsx
+++ b/src/commons/achievement/control/AchievementPreview.tsx
@@ -7,15 +7,12 @@ import { generateAchievementTasks } from 'src/pages/achievement/subcomponents/Ac
 
 import AchievementView from '../AchievementView';
 
-type AchievementPreviewProps = {
+type Props = {
   awaitPublish: boolean;
   publishChanges: () => void;
 };
 
-const AchievementPreview: React.FC<AchievementPreviewProps> = ({
-  awaitPublish,
-  publishChanges
-}) => {
+const AchievementPreview: React.FC<Props> = ({ awaitPublish, publishChanges }) => {
   const inferencer = useContext(AchievementContext);
 
   // Show AchievementView when viewMode is true, otherwise show AchievementTask
@@ -25,7 +22,7 @@ const AchievementPreview: React.FC<AchievementPreviewProps> = ({
    * Marks the achievement uuid that is currently on focus (selected)
    * If an achievement is focused, the cards glow and dashboard displays the AchievementView
    */
-  const focusState = useState<string>('');
+  const focusState = useState('');
   const [focusUuid] = focusState;
 
   return (
diff --git a/src/commons/achievement/control/GoalEditor.tsx b/src/commons/achievement/control/GoalEditor.tsx
index 3e8703741a..9d0a40ef25 100644
--- a/src/commons/achievement/control/GoalEditor.tsx
+++ b/src/commons/achievement/control/GoalEditor.tsx
@@ -4,13 +4,13 @@ import { AchievementContext } from 'src/features/achievement/AchievementConstant
 import EditableGoal from './goalEditor/EditableGoal';
 import GoalAdder from './goalEditor/GoalAdder';
 
-type GoalEditorProps = {
+let editableGoals: JSX.Element[] = [];
+
+type Props = {
   requestPublish: () => void;
 };
 
-let editableGoals: JSX.Element[] = [];
-
-const GoalEditor: React.FC<GoalEditorProps> = ({ requestPublish }) => {
+const GoalEditor: React.FC<Props> = ({ requestPublish }) => {
   const inferencer = useContext(AchievementContext);
 
   /**
@@ -24,7 +24,7 @@ const GoalEditor: React.FC<GoalEditorProps> = ({ requestPublish }) => {
    * at one go. The newUuid holds the newly created goal uuid until the new goal
    * is added into the inferencer.
    */
-  const [newUuid, setNewUuid] = useState<string>('');
+  const [newUuid, setNewUuid] = useState('');
   const allowNewUuid = newUuid === '';
   const releaseUuid = () => setNewUuid('');
 
diff --git a/src/commons/achievement/control/achievementEditor/AchievementAdder.tsx b/src/commons/achievement/control/achievementEditor/AchievementAdder.tsx
index 45dc7cfc03..eaba2abe2a 100644
--- a/src/commons/achievement/control/achievementEditor/AchievementAdder.tsx
+++ b/src/commons/achievement/control/achievementEditor/AchievementAdder.tsx
@@ -5,12 +5,12 @@ import { AchievementContext } from 'src/features/achievement/AchievementConstant
 
 import { achievementTemplate } from './AchievementTemplate';
 
-type AchievementAdderProps = {
+type Props = {
   allowNewUuid: boolean;
   setNewUuid: (uuid: string) => void;
 };
 
-const AchievementAdder: React.FC<AchievementAdderProps> = ({ allowNewUuid, setNewUuid }) => {
+const AchievementAdder: React.FC<Props> = ({ allowNewUuid, setNewUuid }) => {
   const inferencer = useContext(AchievementContext);
 
   const addAchievement = () => setNewUuid(inferencer.insertAchievement(achievementTemplate));
diff --git a/src/commons/achievement/control/achievementEditor/AchievementSettings.tsx b/src/commons/achievement/control/achievementEditor/AchievementSettings.tsx
index cb33ac98ae..cf92a42bba 100644
--- a/src/commons/achievement/control/achievementEditor/AchievementSettings.tsx
+++ b/src/commons/achievement/control/achievementEditor/AchievementSettings.tsx
@@ -8,7 +8,7 @@ import EditableGoalUuids from './achievementSettings/EditableGoalUuids';
 import EditablePosition from './achievementSettings/EditablePosition';
 import EditablePrerequisiteUuids from './achievementSettings/EditablePrerequisiteUuids';
 
-type AchievementSettingsProps = {
+type Props = {
   changeCardBackground: (cardBackground: string) => void;
   changeGoalUuids: (goalUuids: string[]) => void;
   changePosition: (position: number) => void;
@@ -17,19 +17,18 @@ type AchievementSettingsProps = {
   editableAchievement: AchievementItem;
 };
 
-const AchievementSettings: React.FC<AchievementSettingsProps> = props => {
-  const {
-    changeCardBackground,
-    changeGoalUuids,
-    changePosition,
-    changePrerequisiteUuids,
-    changeIsVariableXp,
-    editableAchievement
-  } = props;
+const AchievementSettings: React.FC<Props> = ({
+  changeCardBackground,
+  changeGoalUuids,
+  changePosition,
+  changePrerequisiteUuids,
+  changeIsVariableXp,
+  editableAchievement
+}) => {
   const { uuid, cardBackground, goalUuids, position, prerequisiteUuids, isVariableXp } =
     editableAchievement;
 
-  const [isOpen, setOpen] = useState<boolean>(false);
+  const [isOpen, setOpen] = useState(false);
   const toggleOpen = () => setOpen(!isOpen);
 
   return (
diff --git a/src/commons/achievement/control/achievementEditor/AchievementUuidCopier.tsx b/src/commons/achievement/control/achievementEditor/AchievementUuidCopier.tsx
index 885862936d..ed8e550228 100644
--- a/src/commons/achievement/control/achievementEditor/AchievementUuidCopier.tsx
+++ b/src/commons/achievement/control/achievementEditor/AchievementUuidCopier.tsx
@@ -4,11 +4,11 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React from 'react';
 import { showSuccessMessage } from 'src/commons/utils/notifications/NotificationsHelper';
 
-type AchievementUuidCopierProps = {
+type Props = {
   uuid: string;
 };
 
-const AchievmenetUuidCopier: React.FC<AchievementUuidCopierProps> = ({ uuid }) => {
+const AchievmenetUuidCopier: React.FC<Props> = ({ uuid }) => {
   const hoverText = 'Click to copy achievement UUID';
   const copy = () => {
     navigator.clipboard.writeText(uuid);
diff --git a/src/commons/achievement/control/achievementEditor/EditableCard.tsx b/src/commons/achievement/control/achievementEditor/EditableCard.tsx
index 17ceace87e..62c7ff0369 100644
--- a/src/commons/achievement/control/achievementEditor/EditableCard.tsx
+++ b/src/commons/achievement/control/achievementEditor/EditableCard.tsx
@@ -21,14 +21,6 @@ import {
 import EditableDate from './EditableDate';
 import EditableView from './EditableView';
 
-type EditableCardProps = {
-  uuid: string;
-  isNewAchievement: boolean;
-  releaseUuid: () => void;
-  removeCard: (uuid: string) => void;
-  requestPublish: () => void;
-};
-
 const init = (achievement: AchievementItem): State => {
   return {
     editableAchievement: achievement,
@@ -136,15 +128,27 @@ const reducer = (state: State, action: Action) => {
   }
 };
 
-const EditableCard: React.FC<EditableCardProps> = props => {
-  const { uuid, isNewAchievement, releaseUuid, removeCard, requestPublish } = props;
+type Props = {
+  uuid: string;
+  isNewAchievement: boolean;
+  releaseUuid: () => void;
+  removeCard: (uuid: string) => void;
+  requestPublish: () => void;
+};
 
+const EditableCard: React.FC<Props> = ({
+  uuid,
+  isNewAchievement,
+  releaseUuid,
+  removeCard,
+  requestPublish
+}) => {
   const inferencer = useContext(AchievementContext);
   const achievement = inferencer.getAchievement(uuid);
   const achievementClone = useMemo(() => cloneDeep(achievement), [achievement]);
 
   const [state, dispatch] = useReducer(reducer, achievementClone, init);
-  const [isNew, setIsNew] = useState<boolean>(isNewAchievement);
+  const [isNew, setIsNew] = useState(isNewAchievement);
   const { editableAchievement, isDirty } = state;
   const { cardBackground, deadline, release, title, view, xp } = editableAchievement;
 
diff --git a/src/commons/achievement/control/achievementEditor/EditableDate.tsx b/src/commons/achievement/control/achievementEditor/EditableDate.tsx
index 33e7929454..751325508d 100644
--- a/src/commons/achievement/control/achievementEditor/EditableDate.tsx
+++ b/src/commons/achievement/control/achievementEditor/EditableDate.tsx
@@ -4,14 +4,14 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React, { useState } from 'react';
 import { prettifyDate } from 'src/commons/achievement/utils/DateHelper';
 
-type EditableDateProps = {
+type Props = {
   type: string;
   date?: Date;
   changeDate: (date?: Date) => void;
 };
 
-const EditableDate: React.FC<EditableDateProps> = ({ type, date, changeDate }) => {
-  const [isOpen, setOpen] = useState<boolean>(false);
+const EditableDate: React.FC<Props> = ({ type, date, changeDate }) => {
+  const [isOpen, setOpen] = useState(false);
   const toggleOpen = () => setOpen(!isOpen);
 
   const hoverText = date === undefined ? `No ${type}` : `${prettifyDate(date)}`;
diff --git a/src/commons/achievement/control/achievementEditor/EditableView.tsx b/src/commons/achievement/control/achievementEditor/EditableView.tsx
index 0e8c82d986..cbb1184d1b 100644
--- a/src/commons/achievement/control/achievementEditor/EditableView.tsx
+++ b/src/commons/achievement/control/achievementEditor/EditableView.tsx
@@ -3,15 +3,16 @@ import { IconNames } from '@blueprintjs/icons';
 import { Tooltip2 } from '@blueprintjs/popover2';
 import React, { useState } from 'react';
 import { AchievementView } from 'src/features/achievement/AchievementTypes';
-type EditableViewProps = {
+
+type Props = {
   changeView: (view: AchievementView) => void;
   view: AchievementView;
 };
 
-const EditableView: React.FC<EditableViewProps> = ({ changeView, view }) => {
+const EditableView: React.FC<Props> = ({ changeView, view }) => {
   const { coverImage, description, completionText } = view;
 
-  const [isOpen, setOpen] = useState<boolean>(false);
+  const [isOpen, setOpen] = useState(false);
   const toggleOpen = () => setOpen(!isOpen);
 
   const changeCoverImage = (coverImage: string) => changeView({ ...view, coverImage });
diff --git a/src/commons/achievement/control/achievementEditor/achievementSettings/EditableGoalUuids.tsx b/src/commons/achievement/control/achievementEditor/achievementSettings/EditableGoalUuids.tsx
index e074028c16..165d9ebf68 100644
--- a/src/commons/achievement/control/achievementEditor/achievementSettings/EditableGoalUuids.tsx
+++ b/src/commons/achievement/control/achievementEditor/achievementSettings/EditableGoalUuids.tsx
@@ -5,12 +5,12 @@ import React, { useContext } from 'react';
 import { AchievementContext } from 'src/features/achievement/AchievementConstants';
 import { AchievementGoal } from 'src/features/achievement/AchievementTypes';
 
-type EditableGoalUuidsProps = {
+type Props = {
   changeGoalUuids: (goalUuids: string[]) => void;
   goalUuids: string[];
 };
 
-const EditableGoalUuids: React.FC<EditableGoalUuidsProps> = ({ changeGoalUuids, goalUuids }) => {
+const EditableGoalUuids: React.FC<Props> = ({ changeGoalUuids, goalUuids }) => {
   const inferencer = useContext(AchievementContext);
   const allGoalUuids = inferencer.getAllGoalUuids();
   const selectedUuids = goalUuids.filter(
diff --git a/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePosition.tsx b/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePosition.tsx
index e52e71a4bf..a540b924a7 100644
--- a/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePosition.tsx
+++ b/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePosition.tsx
@@ -3,12 +3,12 @@ import { ItemRenderer, Select } from '@blueprintjs/select';
 import React, { useContext } from 'react';
 import { AchievementContext } from 'src/features/achievement/AchievementConstants';
 
-type EditablePositionProps = {
+type Props = {
   changePosition: (position: number) => void;
   position: number;
 };
 
-const EditablePosition: React.FC<EditablePositionProps> = ({ changePosition, position }) => {
+const EditablePosition: React.FC<Props> = ({ changePosition, position }) => {
   const inferencer = useContext(AchievementContext);
   const maxPosition = inferencer.listTaskUuids().length + 1;
   const positionOptions = [...Array(maxPosition + 1).keys()]; // [0..maxPosition + 1]
diff --git a/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePrerequisiteUuids.tsx b/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePrerequisiteUuids.tsx
index b402393f43..13b6691016 100644
--- a/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePrerequisiteUuids.tsx
+++ b/src/commons/achievement/control/achievementEditor/achievementSettings/EditablePrerequisiteUuids.tsx
@@ -5,15 +5,17 @@ import React, { useContext } from 'react';
 import { AchievementContext } from 'src/features/achievement/AchievementConstants';
 import { AchievementItem } from 'src/features/achievement/AchievementTypes';
 
-type EditablePrerequisiteUuidsProps = {
+type Props = {
   changePrerequisiteUuids: (prerequisiteUuids: string[]) => void;
   uuid: string;
   prerequisiteUuids: string[];
 };
 
-const EditablePrerequisiteUuids: React.FC<EditablePrerequisiteUuidsProps> = props => {
-  const { changePrerequisiteUuids, uuid, prerequisiteUuids } = props;
-
+const EditablePrerequisiteUuids: React.FC<Props> = ({
+  changePrerequisiteUuids,
+  uuid,
+  prerequisiteUuids
+}) => {
   const enablePrerequisites = false;
 
   const inferencer = useContext(AchievementContext);
diff --git a/src/commons/achievement/control/common/ItemDeleter.tsx b/src/commons/achievement/control/common/ItemDeleter.tsx
index 063381a46f..8745815ab9 100644
--- a/src/commons/achievement/control/common/ItemDeleter.tsx
+++ b/src/commons/achievement/control/common/ItemDeleter.tsx
@@ -4,12 +4,12 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React from 'react';
 import { showSimpleConfirmDialog } from 'src/commons/utils/DialogHelper';
 
-type ItemDeleterProps = {
+type Props = {
   deleteItem: () => void;
   item: string;
 };
 
-const ItemDeleter: React.FC<ItemDeleterProps> = ({ deleteItem, item }) => {
+const ItemDeleter: React.FC<Props> = ({ deleteItem, item }) => {
   const confirmDelete = async () => {
     const confirm = await showSimpleConfirmDialog({
       contents: `Are you sure you want to delete '${item}' ?`,
diff --git a/src/commons/achievement/control/common/ItemSaver.tsx b/src/commons/achievement/control/common/ItemSaver.tsx
index 780b9e5220..cdb37181b8 100644
--- a/src/commons/achievement/control/common/ItemSaver.tsx
+++ b/src/commons/achievement/control/common/ItemSaver.tsx
@@ -7,12 +7,12 @@ import {
   showWarningMessage
 } from 'src/commons/utils/notifications/NotificationsHelper';
 
-type ItemSaverProps = {
+type Props = {
   discardChanges: () => void;
   saveChanges: () => void;
 };
 
-const ItemSaver: React.FC<ItemSaverProps> = ({ discardChanges, saveChanges }) => {
+const ItemSaver: React.FC<Props> = ({ discardChanges, saveChanges }) => {
   const handleSaveChanges = () => {
     saveChanges();
     showSuccessMessage('Saved changes locally');
diff --git a/src/commons/achievement/control/goalEditor/EditableDate.tsx b/src/commons/achievement/control/goalEditor/EditableDate.tsx
index 33e7929454..751325508d 100644
--- a/src/commons/achievement/control/goalEditor/EditableDate.tsx
+++ b/src/commons/achievement/control/goalEditor/EditableDate.tsx
@@ -4,14 +4,14 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React, { useState } from 'react';
 import { prettifyDate } from 'src/commons/achievement/utils/DateHelper';
 
-type EditableDateProps = {
+type Props = {
   type: string;
   date?: Date;
   changeDate: (date?: Date) => void;
 };
 
-const EditableDate: React.FC<EditableDateProps> = ({ type, date, changeDate }) => {
-  const [isOpen, setOpen] = useState<boolean>(false);
+const EditableDate: React.FC<Props> = ({ type, date, changeDate }) => {
+  const [isOpen, setOpen] = useState(false);
   const toggleOpen = () => setOpen(!isOpen);
 
   const hoverText = date === undefined ? `No ${type}` : `${prettifyDate(date)}`;
diff --git a/src/commons/achievement/control/goalEditor/EditableGoal.tsx b/src/commons/achievement/control/goalEditor/EditableGoal.tsx
index f3bf9d4eb5..5da4a32df3 100644
--- a/src/commons/achievement/control/goalEditor/EditableGoal.tsx
+++ b/src/commons/achievement/control/goalEditor/EditableGoal.tsx
@@ -13,14 +13,6 @@ import {
 } from './EditableGoalTypes';
 import EditableMeta from './EditableMeta';
 
-type EditableGoalProps = {
-  uuid: string;
-  isNewGoal: boolean;
-  releaseUuid: () => void;
-  removeCard: (uuid: string) => void;
-  requestPublish: () => void;
-};
-
 const init = (goal: GoalDefinition): State => {
   return {
     editableGoal: goal,
@@ -63,15 +55,27 @@ const reducer = (state: State, action: Action) => {
   }
 };
 
-const EditableGoal: React.FC<EditableGoalProps> = props => {
-  const { uuid, isNewGoal, releaseUuid, removeCard, requestPublish } = props;
+type Props = {
+  uuid: string;
+  isNewGoal: boolean;
+  releaseUuid: () => void;
+  removeCard: (uuid: string) => void;
+  requestPublish: () => void;
+};
 
+const EditableGoal: React.FC<Props> = ({
+  uuid,
+  isNewGoal,
+  releaseUuid,
+  removeCard,
+  requestPublish
+}) => {
   const inferencer = useContext(AchievementContext);
   const goal = inferencer.getGoalDefinition(uuid);
   const goalClone = useMemo(() => cloneDeep(goal), [goal]);
 
   const [state, dispatch] = useReducer(reducer, goalClone, init);
-  const [isNew, setIsNew] = useState<boolean>(isNewGoal);
+  const [isNew, setIsNew] = useState(isNewGoal);
   const { editableGoal, isDirty } = state;
   const { meta, text } = editableGoal;
 
diff --git a/src/commons/achievement/control/goalEditor/EditableMeta.tsx b/src/commons/achievement/control/goalEditor/EditableMeta.tsx
index 2979e9e680..665b2a7b30 100644
--- a/src/commons/achievement/control/goalEditor/EditableMeta.tsx
+++ b/src/commons/achievement/control/goalEditor/EditableMeta.tsx
@@ -17,12 +17,12 @@ import EditableBinaryMeta from './metaDetails/EditableBinaryMeta';
 import EditableEventMeta from './metaDetails/EditableEventMeta';
 import EditableManualMeta from './metaDetails/EditableManualMeta';
 
-type EditableMetaProps = {
+type Props = {
   changeMeta: (meta: GoalMeta) => void;
   meta: GoalMeta;
 };
 
-const EditableMeta: React.FC<EditableMetaProps> = ({ changeMeta, meta }) => {
+const EditableMeta: React.FC<Props> = ({ changeMeta, meta }) => {
   const { type } = meta;
 
   const TypeSelect = Select.ofType<GoalType>();
diff --git a/src/commons/achievement/control/goalEditor/EditableTime.tsx b/src/commons/achievement/control/goalEditor/EditableTime.tsx
index 1fb56a694d..36374356f5 100644
--- a/src/commons/achievement/control/goalEditor/EditableTime.tsx
+++ b/src/commons/achievement/control/goalEditor/EditableTime.tsx
@@ -4,14 +4,14 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React, { useState } from 'react';
 import { prettifyTime } from 'src/commons/achievement/utils/DateHelper';
 
-type EditableTimeProps = {
+type Props = {
   type: string;
   time?: Date;
   changeTime: (time?: Date) => void;
 };
 
-const EditableTime: React.FC<EditableTimeProps> = ({ type, time, changeTime }) => {
-  const [isOpen, setOpen] = useState<boolean>(false);
+const EditableTime: React.FC<Props> = ({ type, time, changeTime }) => {
+  const [isOpen, setOpen] = useState(false);
   const toggleOpen = () => setOpen(!isOpen);
 
   const hoverText = time === undefined ? `No ${type}` : `${prettifyTime(time)}`;
diff --git a/src/commons/achievement/control/goalEditor/GoalAdder.tsx b/src/commons/achievement/control/goalEditor/GoalAdder.tsx
index 86082b58b6..dfef7affd3 100644
--- a/src/commons/achievement/control/goalEditor/GoalAdder.tsx
+++ b/src/commons/achievement/control/goalEditor/GoalAdder.tsx
@@ -5,12 +5,12 @@ import { AchievementContext } from 'src/features/achievement/AchievementConstant
 
 import { goalDefinitionTemplate } from './GoalTemplate';
 
-type GoalAdderProps = {
+type Props = {
   allowNewUuid: boolean;
   setNewUuid: (uuid: string) => void;
 };
 
-const GoalAdder: React.FC<GoalAdderProps> = ({ allowNewUuid, setNewUuid }) => {
+const GoalAdder: React.FC<Props> = ({ allowNewUuid, setNewUuid }) => {
   const inferencer = useContext(AchievementContext);
 
   const addGoal = () => setNewUuid(inferencer.insertGoalDefinition(goalDefinitionTemplate));
diff --git a/src/commons/achievement/control/goalEditor/metaDetails/EditableAssessmentMeta.tsx b/src/commons/achievement/control/goalEditor/metaDetails/EditableAssessmentMeta.tsx
index 7ab159fb06..cbd42deb3c 100644
--- a/src/commons/achievement/control/goalEditor/metaDetails/EditableAssessmentMeta.tsx
+++ b/src/commons/achievement/control/goalEditor/metaDetails/EditableAssessmentMeta.tsx
@@ -3,13 +3,12 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React from 'react';
 import { AssessmentMeta, GoalMeta } from 'src/features/achievement/AchievementTypes';
 
-type EditableAssessmentMetaProps = {
+type Props = {
   assessmentMeta: AssessmentMeta;
   changeMeta: (meta: GoalMeta) => void;
 };
 
-const EditableAssessmentMeta: React.FC<EditableAssessmentMetaProps> = props => {
-  const { assessmentMeta, changeMeta } = props;
+const EditableAssessmentMeta: React.FC<Props> = ({ assessmentMeta, changeMeta }) => {
   const { assessmentNumber, requiredCompletionFrac } = assessmentMeta;
 
   const changeAssessmentNumber = (assessmentNumber: number) =>
diff --git a/src/commons/achievement/control/goalEditor/metaDetails/EditableBinaryMeta.tsx b/src/commons/achievement/control/goalEditor/metaDetails/EditableBinaryMeta.tsx
index 17368edba1..8fd93115c6 100644
--- a/src/commons/achievement/control/goalEditor/metaDetails/EditableBinaryMeta.tsx
+++ b/src/commons/achievement/control/goalEditor/metaDetails/EditableBinaryMeta.tsx
@@ -12,11 +12,6 @@ import { AND, BooleanExpression, OR } from 'src/features/achievement/ExpressionT
  * Why is this even a possible boolean expression? why would anyone ever use false?
  */
 
-type EditableBinaryMetaProps = {
-  binaryMeta: BinaryMeta;
-  changeMeta: (meta: GoalMeta) => void;
-};
-
 type Joiner = 'AND' | 'OR';
 const JoinerSelect = Select.ofType<Joiner>();
 const joinerRenderer: ItemRenderer<Joiner> = (joiner, { handleClick }) => (
@@ -44,7 +39,12 @@ const conditionSplitter = (condition: BooleanExpression): string[] => {
   }
 };
 
-const EditableBinaryMeta: React.FC<EditableBinaryMetaProps> = ({ binaryMeta, changeMeta }) => {
+type Props = {
+  binaryMeta: BinaryMeta;
+  changeMeta: (meta: GoalMeta) => void;
+};
+
+const EditableBinaryMeta: React.FC<Props> = ({ binaryMeta, changeMeta }) => {
   const { condition, targetCount } = binaryMeta;
 
   const joiners: string[] = [];
diff --git a/src/commons/achievement/control/goalEditor/metaDetails/EditableEventMeta.tsx b/src/commons/achievement/control/goalEditor/metaDetails/EditableEventMeta.tsx
index b2ea3beb5d..7089660cff 100644
--- a/src/commons/achievement/control/goalEditor/metaDetails/EditableEventMeta.tsx
+++ b/src/commons/achievement/control/goalEditor/metaDetails/EditableEventMeta.tsx
@@ -8,17 +8,17 @@ import { EventMeta, EventType, GoalMeta } from 'src/features/achievement/Achieve
 import EditableDate from '../EditableDate';
 import EditableTime from '../EditableTime';
 
-type EditableEventMetaProps = {
-  changeMeta: (meta: GoalMeta) => void;
-  eventMeta: EventMeta;
-};
-
 const EventSelect = Select.ofType<EventType>();
 const eventRenderer: ItemRenderer<EventType> = (eventName, { handleClick }) => (
   <MenuItem key={eventName} onClick={handleClick} text={eventName} />
 );
 
-const EditableEventMeta: React.FC<EditableEventMetaProps> = ({ changeMeta, eventMeta }) => {
+type Props = {
+  changeMeta: (meta: GoalMeta) => void;
+  eventMeta: EventMeta;
+};
+
+const EditableEventMeta: React.FC<Props> = ({ changeMeta, eventMeta }) => {
   const { eventNames, targetCount, release, deadline, observeFrom, observeTo } = eventMeta;
 
   const changeTargetCount = (targetCount: number) =>
diff --git a/src/commons/achievement/control/goalEditor/metaDetails/EditableManualMeta.tsx b/src/commons/achievement/control/goalEditor/metaDetails/EditableManualMeta.tsx
index b68c59ecbc..6f500ab972 100644
--- a/src/commons/achievement/control/goalEditor/metaDetails/EditableManualMeta.tsx
+++ b/src/commons/achievement/control/goalEditor/metaDetails/EditableManualMeta.tsx
@@ -4,12 +4,12 @@ import { Tooltip2 } from '@blueprintjs/popover2';
 import React from 'react';
 import { GoalMeta, ManualMeta } from 'src/features/achievement/AchievementTypes';
 
-type EditableManualMetaProps = {
+type Props = {
   changeMeta: (meta: GoalMeta) => void;
   manualMeta: ManualMeta;
 };
 
-const EditableManualMeta: React.FC<EditableManualMetaProps> = ({ changeMeta, manualMeta }) => {
+const EditableManualMeta: React.FC<Props> = ({ changeMeta, manualMeta }) => {
   const { targetCount } = manualMeta;
 
   const changeTargetCount = (targetCount: number) =>
diff --git a/src/commons/achievement/overview/AchievementLevel.tsx b/src/commons/achievement/overview/AchievementLevel.tsx
index d8cf6985c2..223fec2250 100644
--- a/src/commons/achievement/overview/AchievementLevel.tsx
+++ b/src/commons/achievement/overview/AchievementLevel.tsx
@@ -5,12 +5,12 @@ import { xpPerLevel } from '../../../features/achievement/AchievementConstants';
 import Constants from '../../utils/Constants';
 import AchievementMilestone from './AchievementMilestone';
 
-type AchievementLevelProps = {
+type Props = {
   studentXp: number;
 };
 
-const AchievementLevel: React.FC<AchievementLevelProps> = ({ studentXp }) => {
-  const [showMilestone, setShowMilestone] = useState<boolean>(false);
+const AchievementLevel: React.FC<Props> = ({ studentXp }) => {
+  const [showMilestone, setShowMilestone] = useState(false);
   const displayMilestone = () => setShowMilestone(true);
   const hideMilestone = () => setShowMilestone(false);
 
diff --git a/src/commons/achievement/overview/AchievementMilestone.tsx b/src/commons/achievement/overview/AchievementMilestone.tsx
index 78224168ec..65d9fb77d8 100644
--- a/src/commons/achievement/overview/AchievementMilestone.tsx
+++ b/src/commons/achievement/overview/AchievementMilestone.tsx
@@ -2,12 +2,12 @@ import React from 'react';
 
 import Constants from '../../utils/Constants';
 
-type AchievementMilestoneProps = {
+type Props = {
   studentXp: number;
 };
 
 // 36k XP = Level 37
-const AchievementMilestone: React.FC<AchievementMilestoneProps> = ({ studentXp }) => {
+const AchievementMilestone: React.FC<Props> = ({ studentXp }) => {
   return (
     <div className="milestone">
       <h3>Your Total XP</h3>
diff --git a/src/commons/achievement/view/AchievementViewCompletion.tsx b/src/commons/achievement/view/AchievementViewCompletion.tsx
index 8178eacd57..e90018696d 100644
--- a/src/commons/achievement/view/AchievementViewCompletion.tsx
+++ b/src/commons/achievement/view/AchievementViewCompletion.tsx
@@ -1,13 +1,11 @@
 import React from 'react';
 
-type AchievementViewCompletionProps = {
+type Props = {
   awardedXp: number;
   completionText: string;
 };
 
-const AchievementViewCompletion: React.FC<AchievementViewCompletionProps> = props => {
-  const { awardedXp, completionText } = props;
-
+const AchievementViewCompletion: React.FC<Props> = ({ awardedXp, completionText }) => {
   const paragraphs = completionText ? completionText.split('\n') : [''];
 
   return (
diff --git a/src/commons/achievement/view/AchievementViewGoal.tsx b/src/commons/achievement/view/AchievementViewGoal.tsx
index 08dbd9ed15..b73a5f516a 100644
--- a/src/commons/achievement/view/AchievementViewGoal.tsx
+++ b/src/commons/achievement/view/AchievementViewGoal.tsx
@@ -3,10 +3,6 @@ import React from 'react';
 
 import { AchievementGoal } from '../../../features/achievement/AchievementTypes';
 
-type AchievementViewGoalProps = {
-  goals: AchievementGoal[];
-};
-
 /**
  * Maps an array of goalUuid to Goal component
  *
@@ -37,7 +33,11 @@ const mapGoalToJSX = (goal: AchievementGoal) => {
   );
 };
 
-const AchievementViewGoal: React.FC<AchievementViewGoalProps> = ({ goals }) => {
+type Props = {
+  goals: AchievementGoal[];
+};
+
+const AchievementViewGoal: React.FC<Props> = ({ goals }) => {
   return (
     <>
       <h1 className="progress-header">Progress</h1>
diff --git a/src/commons/application/ApplicationTypes.ts b/src/commons/application/ApplicationTypes.ts
index 4d9ee2cd2b..2f23ef9c28 100644
--- a/src/commons/application/ApplicationTypes.ts
+++ b/src/commons/application/ApplicationTypes.ts
@@ -1,6 +1,5 @@
 import { Chapter, Language, SourceError, Variant } from 'js-slang/dist/types';
 
-import { AcademyState } from '../../features/academy/AcademyTypes';
 import { AchievementState } from '../../features/achievement/AchievementTypes';
 import { DashboardState } from '../../features/dashboard/DashboardTypes';
 import { GradingQuery } from '../../features/grading/GradingTypes';
@@ -25,7 +24,6 @@ import { SessionState } from './types/SessionTypes';
 
 export type OverallState = {
   readonly router: RouterState;
-  readonly academy: AcademyState;
   readonly achievement: AchievementState;
   readonly playground: PlaygroundState;
   readonly session: SessionState;
@@ -297,10 +295,6 @@ export const getLanguageConfig = (
 
 export const defaultRouter: RouterState = null;
 
-export const defaultAcademy: AcademyState = {
-  gameCanvas: undefined
-};
-
 export const defaultDashboard: DashboardState = {
   gradingSummary: {
     cols: [],
@@ -558,7 +552,6 @@ export const defaultSideContentManager: SideContentManagerState = {
 
 export const defaultState: OverallState = {
   router: defaultRouter,
-  academy: defaultAcademy,
   achievement: defaultAchievement,
   dashboard: defaultDashboard,
   playground: defaultPlayground,
diff --git a/src/commons/application/__tests__/Application.tsx b/src/commons/application/__tests__/Application.tsx
index 12d071314c..54ff1729f2 100644
--- a/src/commons/application/__tests__/Application.tsx
+++ b/src/commons/application/__tests__/Application.tsx
@@ -1,4 +1,4 @@
-import { useSelector } from 'react-redux';
+import { useTypedSelector } from 'src/commons/utils/Hooks';
 import { shallowRender } from 'src/commons/utils/TestUtils';
 
 import Application from '../Application';
@@ -19,7 +19,7 @@ jest.mock('react-redux', () => ({
   useDispatch: jest.fn(),
   useSelector: jest.fn()
 }));
-const useSelectorMock = useSelector as jest.Mock;
+const useSelectorMock = useTypedSelector as jest.Mock;
 
 test('Application renders correctly', () => {
   useSelectorMock.mockReturnValue({ name: 'Bob' });
diff --git a/src/commons/application/reducers/RootReducer.ts b/src/commons/application/reducers/RootReducer.ts
index 2e2e9affbe..6d44a73187 100644
--- a/src/commons/application/reducers/RootReducer.ts
+++ b/src/commons/application/reducers/RootReducer.ts
@@ -1,6 +1,5 @@
 import { combineReducers } from 'redux';
 
-import { AcademyReducer as academy } from '../../../features/academy/AcademyReducer';
 import { AchievementReducer as achievement } from '../../../features/achievement/AchievementReducer';
 import { DashboardReducer as dashboard } from '../../../features/dashboard/DashboardReducer';
 import { PlaygroundReducer as playground } from '../../../features/playground/PlaygroundReducer';
@@ -14,7 +13,6 @@ import { SessionsReducer as session } from './SessionsReducer';
 const createRootReducer = () =>
   combineReducers({
     router,
-    academy,
     achievement,
     dashboard,
     playground,
diff --git a/src/commons/assessmentWorkspace/AssessmentWorkspace.tsx b/src/commons/assessmentWorkspace/AssessmentWorkspace.tsx
index ae3146472a..ed790279c3 100644
--- a/src/commons/assessmentWorkspace/AssessmentWorkspace.tsx
+++ b/src/commons/assessmentWorkspace/AssessmentWorkspace.tsx
@@ -97,6 +97,7 @@ import {
 } from '../workspace/WorkspaceActions';
 import { WorkspaceLocation, WorkspaceState } from '../workspace/WorkspaceTypes';
 import AssessmentWorkspaceGradingResult from './AssessmentWorkspaceGradingResult';
+
 export type AssessmentWorkspaceProps = {
   assessmentId: number;
   needsPassword: boolean;
diff --git a/src/commons/assessmentWorkspace/AssessmentWorkspaceGradingResult.tsx b/src/commons/assessmentWorkspace/AssessmentWorkspaceGradingResult.tsx
index 450cf6f0f2..db1eea1ac4 100644
--- a/src/commons/assessmentWorkspace/AssessmentWorkspaceGradingResult.tsx
+++ b/src/commons/assessmentWorkspace/AssessmentWorkspaceGradingResult.tsx
@@ -4,9 +4,7 @@ import React from 'react';
 import Markdown from '../Markdown';
 import { getPrettyDate } from '../utils/DateHelper';
 
-type AssessmentWorkspaceGradingResultProps = StateProps;
-
-type StateProps = {
+type Props = {
   graderName: string;
   gradedAt: string;
   xp: number;
@@ -14,7 +12,7 @@ type StateProps = {
   comments?: string;
 };
 
-const AssessmentWorkspaceGradingResult: React.FC<AssessmentWorkspaceGradingResultProps> = props => (
+const AssessmentWorkspaceGradingResult: React.FC<Props> = props => (
   <div className="GradingResult">
     <div className="grading-result-table">
       <HTMLTable>
diff --git a/src/commons/assessmentWorkspace/__tests__/__snapshots__/AssessmentWorkspace.tsx.snap b/src/commons/assessmentWorkspace/__tests__/__snapshots__/AssessmentWorkspace.tsx.snap
index d025a4a9a1..8c418ef182 100644
--- a/src/commons/assessmentWorkspace/__tests__/__snapshots__/AssessmentWorkspace.tsx.snap
+++ b/src/commons/assessmentWorkspace/__tests__/__snapshots__/AssessmentWorkspace.tsx.snap
@@ -219,7 +219,7 @@ exports[`AssessmentWorkspace AssessmentWorkspace page with ContestVoting questio
               class="editor-container"
             >
               <div
-                class="Editor bp4-card bp4-elevation-0"
+                class="Editor bp5-card bp5-elevation-0"
                 tabindex="-1"
               >
                 <div
@@ -2249,7 +2249,7 @@ exports[`AssessmentWorkspace AssessmentWorkspace page with overdue assessment re
               class="editor-container"
             >
               <div
-                class="Editor bp4-card bp4-elevation-0"
+                class="Editor bp5-card bp5-elevation-0"
                 tabindex="-1"
               >
                 <div
@@ -3019,7 +3019,7 @@ exports[`AssessmentWorkspace AssessmentWorkspace page with programming question
               class="editor-container"
             >
               <div
-                class="Editor bp4-card bp4-elevation-0"
+                class="Editor bp5-card bp5-elevation-0"
                 tabindex="-1"
               >
                 <div
@@ -3741,7 +3741,7 @@ exports[`AssessmentWorkspace AssessmentWorkspace renders Grading tab correctly i
               class="editor-container"
             >
               <div
-                class="Editor bp4-card bp4-elevation-0"
+                class="Editor bp5-card bp5-elevation-0"
                 tabindex="-1"
               >
                 <div
diff --git a/src/commons/controlBar/ControlBarClearButton.tsx b/src/commons/controlBar/ControlBarClearButton.tsx
index fdb87f5c41..1d83ddf3fc 100644
--- a/src/commons/controlBar/ControlBarClearButton.tsx
+++ b/src/commons/controlBar/ControlBarClearButton.tsx
@@ -3,12 +3,10 @@ import React from 'react';
 
 import ControlButton from '../ControlButton';
 
-type ControlBarClearButtonProps = {
+type Props = {
   handleReplOutputClear: () => void;
 };
 
-export const ControlBarClearButton: React.FC<ControlBarClearButtonProps> = ({
-  handleReplOutputClear
-}) => {
+export const ControlBarClearButton: React.FC<Props> = ({ handleReplOutputClear }) => {
   return <ControlButton label="Clear" icon={IconNames.REMOVE} onClick={handleReplOutputClear} />;
 };
diff --git a/src/commons/controlBar/ControlBarEvalButton.tsx b/src/commons/controlBar/ControlBarEvalButton.tsx
index 8096e3ef1e..67380d2a78 100644
--- a/src/commons/controlBar/ControlBarEvalButton.tsx
+++ b/src/commons/controlBar/ControlBarEvalButton.tsx
@@ -4,15 +4,12 @@ import React from 'react';
 
 import ControlButton from '../ControlButton';
 
-type ControlBarEvalButtonProps = {
+type Props = {
   handleReplEval: () => void;
   isRunning: boolean;
 };
 
-export const ControlBarEvalButton: React.FC<ControlBarEvalButtonProps> = ({
-  handleReplEval,
-  isRunning
-}) => {
+export const ControlBarEvalButton: React.FC<Props> = ({ handleReplEval, isRunning }) => {
   return isRunning ? null : (
     <Tooltip2 content="...or press shift-enter in the REPL">
       <ControlButton label="Eval" icon={IconNames.CODE} onClick={handleReplEval} />
diff --git a/src/commons/controlBar/ControlBarGoogleDriveButtons.tsx b/src/commons/controlBar/ControlBarGoogleDriveButtons.tsx
index 8e8b2890e8..ce70690d60 100644
--- a/src/commons/controlBar/ControlBarGoogleDriveButtons.tsx
+++ b/src/commons/controlBar/ControlBarGoogleDriveButtons.tsx
@@ -7,7 +7,13 @@ import { PersistenceFile, PersistenceState } from '../../features/persistence/Pe
 import ControlButton from '../ControlButton';
 import { useResponsive } from '../utils/Hooks';
 
-export type ControlBarGoogleDriveButtonsProps = {
+const stateToIntent: { [state in PersistenceState]: Intent } = {
+  INACTIVE: Intent.NONE,
+  SAVED: Intent.PRIMARY,
+  DIRTY: Intent.WARNING
+};
+
+type Props = {
   isFolderModeEnabled: boolean;
   loggedInAs?: string;
   currentFile?: PersistenceFile;
@@ -19,13 +25,7 @@ export type ControlBarGoogleDriveButtonsProps = {
   onPopoverOpening?: () => any;
 };
 
-const stateToIntent: { [state in PersistenceState]: Intent } = {
-  INACTIVE: Intent.NONE,
-  SAVED: Intent.PRIMARY,
-  DIRTY: Intent.WARNING
-};
-
-export const ControlBarGoogleDriveButtons: React.FC<ControlBarGoogleDriveButtonsProps> = props => {
+export const ControlBarGoogleDriveButtons: React.FC<Props> = props => {
   const { isMobileBreakpoint } = useResponsive();
   const state: PersistenceState = props.currentFile
     ? props.isDirty
diff --git a/src/commons/controlBar/ControlBarQuestionViewButton.tsx b/src/commons/controlBar/ControlBarQuestionViewButton.tsx
index fe01b3e639..710c8ac634 100644
--- a/src/commons/controlBar/ControlBarQuestionViewButton.tsx
+++ b/src/commons/controlBar/ControlBarQuestionViewButton.tsx
@@ -6,13 +6,11 @@ import ControlButton from '../ControlButton';
  * @prop questionProgress a tuple of (current question number, question length) where
  *   the current question number is 1-based.
  */
-type ControlBarQuestionViewButtonProps = {
+type Props = {
   questionProgress: [number, number] | null;
 };
 
-export const ControlBarQuestionViewButton: React.FC<ControlBarQuestionViewButtonProps> = ({
-  questionProgress
-}) => {
+export const ControlBarQuestionViewButton: React.FC<Props> = ({ questionProgress }) => {
   return (
     <ControlButton
       label={`Question ${questionProgress![0]} of ${questionProgress![1]}  `}
diff --git a/src/commons/controlBar/ControlBarResetButton.tsx b/src/commons/controlBar/ControlBarResetButton.tsx
index 4a299a853a..d06cd48d4f 100644
--- a/src/commons/controlBar/ControlBarResetButton.tsx
+++ b/src/commons/controlBar/ControlBarResetButton.tsx
@@ -3,10 +3,10 @@ import React from 'react';
 
 import ControlButton from '../ControlButton';
 
-type ControlBarResetButtonProps = {
+type Props = {
   onClick?(): any;
 };
 
-export const ControlBarResetButton: React.FC<ControlBarResetButtonProps> = ({ onClick }) => {
+export const ControlBarResetButton: React.FC<Props> = ({ onClick }) => {
   return <ControlButton label="Reset" icon={IconNames.REPEAT} onClick={onClick} />;
 };
diff --git a/src/commons/controlBar/ControlBarReturnToAcademyButton.tsx b/src/commons/controlBar/ControlBarReturnToAcademyButton.tsx
index b15bee36a1..9478eb02b5 100644
--- a/src/commons/controlBar/ControlBarReturnToAcademyButton.tsx
+++ b/src/commons/controlBar/ControlBarReturnToAcademyButton.tsx
@@ -3,13 +3,11 @@ import React from 'react';
 
 import ControlButton from '../ControlButton';
 
-type ControlBarReturnToAcademyButtonProps = {
+type Props = {
   onClick?(): any;
 };
 
-export const ControlBarReturnToAcademyButton: React.FC<ControlBarReturnToAcademyButtonProps> = ({
-  onClick
-}) => {
+export const ControlBarReturnToAcademyButton: React.FC<Props> = ({ onClick }) => {
   return (
     <ControlButton
       label="Return to Academy"
diff --git a/src/commons/controlBar/ControlBarToggleEditModeButton.tsx b/src/commons/controlBar/ControlBarToggleEditModeButton.tsx
index 3ed763c6d8..877b6da2c3 100644
--- a/src/commons/controlBar/ControlBarToggleEditModeButton.tsx
+++ b/src/commons/controlBar/ControlBarToggleEditModeButton.tsx
@@ -4,12 +4,12 @@ import React from 'react';
 
 import ControlButton from '../ControlButton';
 
-type ControlBarToggleEditModeButtonProps = {
+type Props = {
   toggleEditMode?(): void;
   editingMode?: string;
 };
 
-export const ControlBarToggleEditModeButton: React.FC<ControlBarToggleEditModeButtonProps> = ({
+export const ControlBarToggleEditModeButton: React.FC<Props> = ({
   toggleEditMode,
   editingMode
 }) => {
diff --git a/src/commons/controlBar/ControlBarToggleFolderModeButton.tsx b/src/commons/controlBar/ControlBarToggleFolderModeButton.tsx
index 5be7620b71..2735537470 100644
--- a/src/commons/controlBar/ControlBarToggleFolderModeButton.tsx
+++ b/src/commons/controlBar/ControlBarToggleFolderModeButton.tsx
@@ -5,14 +5,14 @@ import React from 'react';
 
 import ControlButton from '../ControlButton';
 
-type ControlBarToggleFolderModeButtonProps = {
+type Props = {
   isFolderModeEnabled: boolean;
   isSessionActive: boolean;
   isPersistenceActive: boolean;
   toggleFolderMode: () => void;
 };
 
-export const ControlBarToggleFolderModeButton: React.FC<ControlBarToggleFolderModeButtonProps> = ({
+export const ControlBarToggleFolderModeButton: React.FC<Props> = ({
   isFolderModeEnabled,
   isSessionActive,
   isPersistenceActive,
diff --git a/src/commons/controlBar/github/ControlBarGitHubButtons.tsx b/src/commons/controlBar/github/ControlBarGitHubButtons.tsx
index 21e4938064..c9e4d761ea 100644
--- a/src/commons/controlBar/github/ControlBarGitHubButtons.tsx
+++ b/src/commons/controlBar/github/ControlBarGitHubButtons.tsx
@@ -8,7 +8,7 @@ import { useResponsive } from 'src/commons/utils/Hooks';
 import { GitHubSaveInfo } from '../../../features/github/GitHubTypes';
 import ControlButton from '../../ControlButton';
 
-export type ControlBarGitHubButtonsProps = {
+type Props = {
   isFolderModeEnabled: boolean;
   loggedInAs?: Octokit;
   githubSaveInfo: GitHubSaveInfo;
@@ -26,7 +26,7 @@ export type ControlBarGitHubButtonsProps = {
  *
  * @param props Component properties
  */
-export const ControlBarGitHubButtons: React.FC<ControlBarGitHubButtonsProps> = props => {
+export const ControlBarGitHubButtons: React.FC<Props> = props => {
   const { isMobileBreakpoint } = useResponsive();
 
   const filePath = props.githubSaveInfo.filePath || '';
diff --git a/src/commons/delay/Delay.tsx b/src/commons/delay/Delay.tsx
index 0d92837c5a..5c190739cb 100644
--- a/src/commons/delay/Delay.tsx
+++ b/src/commons/delay/Delay.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-export type DelayProps = {
+type Props = {
   children: JSX.Element;
   waitInMsBeforeRender: number;
 };
@@ -8,10 +8,8 @@ export type DelayProps = {
 /**
  * Delays the rendering of child components by a set time.
  */
-const Delay: React.FC<DelayProps> = (props: DelayProps) => {
-  const { children, waitInMsBeforeRender } = props;
-
-  const [isRendered, setIsRendered] = React.useState<boolean>(false);
+const Delay: React.FC<Props> = ({ children, waitInMsBeforeRender }) => {
+  const [isRendered, setIsRendered] = React.useState(false);
 
   React.useEffect(() => {
     const timeoutId = setTimeout(() => setIsRendered(true), waitInMsBeforeRender);
diff --git a/src/commons/dropdown/DropdownAbout.tsx b/src/commons/dropdown/DropdownAbout.tsx
index 6350792a7f..9f759cffa8 100644
--- a/src/commons/dropdown/DropdownAbout.tsx
+++ b/src/commons/dropdown/DropdownAbout.tsx
@@ -4,12 +4,12 @@ import React from 'react';
 
 import { Links } from '../utils/Constants';
 
-type DialogProps = {
+type Props = {
   isOpen: boolean;
   onClose: () => void;
 };
 
-const DropdownAbout: React.FC<DialogProps> = props => (
+const DropdownAbout: React.FC<Props> = props => (
   <Dialog
     style={{ textAlign: 'justify' }}
     icon={IconNames.HELP}
diff --git a/src/commons/dropdown/DropdownCreateCourse.tsx b/src/commons/dropdown/DropdownCreateCourse.tsx
index c2cf92a5bf..41c6fc09a6 100644
--- a/src/commons/dropdown/DropdownCreateCourse.tsx
+++ b/src/commons/dropdown/DropdownCreateCourse.tsx
@@ -24,12 +24,12 @@ import { UpdateCourseConfiguration } from '../application/types/SessionTypes';
 import Markdown from '../Markdown';
 import { showWarningMessage } from '../utils/notifications/NotificationsHelper';
 
-type DialogProps = {
+type Props = {
   isOpen: boolean;
   onClose: () => void;
 };
 
-const DropdownCreateCourse: React.FC<DialogProps> = props => {
+const DropdownCreateCourse: React.FC<Props> = props => {
   const dispatch = useDispatch();
 
   const [courseConfig, setCourseConfig] = React.useState<UpdateCourseConfiguration>({
diff --git a/src/commons/dropdown/DropdownHelp.tsx b/src/commons/dropdown/DropdownHelp.tsx
index b731301b7d..5ff6305035 100644
--- a/src/commons/dropdown/DropdownHelp.tsx
+++ b/src/commons/dropdown/DropdownHelp.tsx
@@ -6,12 +6,12 @@ import Markdown from '../Markdown';
 import { Links } from '../utils/Constants';
 import { useTypedSelector } from '../utils/Hooks';
 
-type DialogProps = {
+type Props = {
   isOpen: boolean;
   onClose: () => void;
 };
 
-const DropdownHelp: React.FC<DialogProps> = props => {
+const DropdownHelp: React.FC<Props> = props => {
   const moduleHelpText = useTypedSelector(store => store.session.moduleHelpText);
 
   return (
diff --git a/src/commons/editor/Editor.tsx b/src/commons/editor/Editor.tsx
index bf10545724..ef98c0afb8 100644
--- a/src/commons/editor/Editor.tsx
+++ b/src/commons/editor/Editor.tsx
@@ -643,7 +643,7 @@ const EditorBase = React.memo((props: EditorProps & LocalStateProps) => {
   }, []);
 
   return (
-    <HotKeys className="Editor bp4-card bp4-elevation-0" handlers={handlers}>
+    <HotKeys className="Editor bp5-card bp5-elevation-0" handlers={handlers}>
       <div className="row editor-react-ace" data-testid="Editor">
         <AceEditor {...aceEditorProps} ref={reactAceRef} />
       </div>
diff --git a/src/commons/editor/tabs/EditorTab.tsx b/src/commons/editor/tabs/EditorTab.tsx
index 94ea329864..9eabde9332 100644
--- a/src/commons/editor/tabs/EditorTab.tsx
+++ b/src/commons/editor/tabs/EditorTab.tsx
@@ -3,16 +3,14 @@ import { IconNames } from '@blueprintjs/icons';
 import classNames from 'classnames';
 import React from 'react';
 
-export type EditorTabProps = {
+type Props = {
   filePath: string;
   isActive: boolean;
   setActive: () => void;
   remove: () => void;
 };
 
-const EditorTab: React.FC<EditorTabProps> = (props: EditorTabProps) => {
-  const { filePath, isActive, setActive, remove } = props;
-
+const EditorTab: React.FC<Props> = ({ filePath, isActive, setActive, remove }) => {
   const onClick = (e: React.MouseEvent<HTMLElement>) => {
     // Stop the click event from propagating to the parent component.
     e.stopPropagation();
diff --git a/src/commons/editor/tabs/EditorTabContainer.tsx b/src/commons/editor/tabs/EditorTabContainer.tsx
index b3c2fbe2f1..b884fbbe73 100644
--- a/src/commons/editor/tabs/EditorTabContainer.tsx
+++ b/src/commons/editor/tabs/EditorTabContainer.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import EditorTab from './EditorTab';
 import { getShortestUniqueFilePaths } from './utils';
 
-export type EditorTabContainerProps = {
+type Props = {
   baseFilePath: string;
   filePaths: string[];
   activeEditorTabIndex: number;
@@ -11,15 +11,13 @@ export type EditorTabContainerProps = {
   removeEditorTabByIndex: (editorTabIndex: number) => void;
 };
 
-const EditorTabContainer: React.FC<EditorTabContainerProps> = (props: EditorTabContainerProps) => {
-  const {
-    baseFilePath,
-    filePaths,
-    activeEditorTabIndex,
-    setActiveEditorTabIndex,
-    removeEditorTabByIndex
-  } = props;
-
+const EditorTabContainer: React.FC<Props> = ({
+  baseFilePath,
+  filePaths,
+  activeEditorTabIndex,
+  setActiveEditorTabIndex,
+  removeEditorTabByIndex
+}) => {
   const handleHorizontalScroll = (e: React.WheelEvent<HTMLDivElement>) => {
     e.currentTarget.scrollTo({
       left: e.currentTarget.scrollLeft + e.deltaY
diff --git a/src/commons/fileSystemView/FileSystemView.tsx b/src/commons/fileSystemView/FileSystemView.tsx
index 5aeb2b6590..f248b92505 100644
--- a/src/commons/fileSystemView/FileSystemView.tsx
+++ b/src/commons/fileSystemView/FileSystemView.tsx
@@ -12,18 +12,17 @@ import FileSystemViewIndentationPadding from './FileSystemViewIndentationPadding
 import FileSystemViewList from './FileSystemViewList';
 import FileSystemViewPlaceholderNode from './FileSystemViewPlaceholderNode';
 
-export type FileSystemViewProps = {
+type Props = {
   workspaceLocation: WorkspaceLocation;
   basePath: string;
 };
 
-const FileSystemView: React.FC<FileSystemViewProps> = (props: FileSystemViewProps) => {
-  const { workspaceLocation, basePath } = props;
+const FileSystemView: React.FC<Props> = ({ workspaceLocation, basePath }) => {
   const fileSystem = useTypedSelector(state => state.fileSystem.inBrowserFileSystem);
 
-  const [isAddingNewFile, setIsAddingNewFile] = React.useState<boolean>(false);
-  const [isAddingNewDirectory, setIsAddingNewDirectory] = React.useState<boolean>(false);
-  const [fileSystemViewListKey, setFileSystemViewListKey] = React.useState<number>(0);
+  const [isAddingNewFile, setIsAddingNewFile] = React.useState(false);
+  const [isAddingNewDirectory, setIsAddingNewDirectory] = React.useState(false);
+  const [fileSystemViewListKey, setFileSystemViewListKey] = React.useState(0);
 
   const handleCreateNewFile = () => setIsAddingNewFile(true);
   const handleCreateNewDirectory = () => setIsAddingNewDirectory(true);
diff --git a/src/commons/fileSystemView/FileSystemViewContextMenu.tsx b/src/commons/fileSystemView/FileSystemViewContextMenu.tsx
index 51c8a68dee..a107d6bf87 100644
--- a/src/commons/fileSystemView/FileSystemViewContextMenu.tsx
+++ b/src/commons/fileSystemView/FileSystemViewContextMenu.tsx
@@ -4,7 +4,7 @@ import classNames from 'classnames';
 import React from 'react';
 import classes from 'src/styles/ContextMenu.module.scss';
 
-export type FileSystemViewContextMenuProps = {
+type Props = {
   children?: JSX.Element;
   className?: string;
   createNewFile?: () => void;
@@ -14,10 +14,15 @@ export type FileSystemViewContextMenuProps = {
   remove?: () => void;
 };
 
-const FileSystemViewContextMenu: React.FC<FileSystemViewContextMenuProps> = (
-  props: FileSystemViewContextMenuProps
-) => {
-  const { children, className, createNewFile, createNewDirectory, open, rename, remove } = props;
+const FileSystemViewContextMenu: React.FC<Props> = ({
+  children,
+  className,
+  createNewFile,
+  createNewDirectory,
+  open,
+  rename,
+  remove
+}) => {
   const [menuProps, toggleMenu] = useMenuState();
   const [anchorPoint, setAnchorPoint] = React.useState({ x: 0, y: 0 });
 
diff --git a/src/commons/fileSystemView/FileSystemViewDirectoryNode.tsx b/src/commons/fileSystemView/FileSystemViewDirectoryNode.tsx
index 4c136de3b1..fa59e26c4e 100644
--- a/src/commons/fileSystemView/FileSystemViewDirectoryNode.tsx
+++ b/src/commons/fileSystemView/FileSystemViewDirectoryNode.tsx
@@ -16,7 +16,7 @@ import FileSystemViewIndentationPadding from './FileSystemViewIndentationPadding
 import FileSystemViewList from './FileSystemViewList';
 import FileSystemViewPlaceholderNode from './FileSystemViewPlaceholderNode';
 
-export type FileSystemViewDirectoryNodeProps = {
+type Props = {
   workspaceLocation: WorkspaceLocation;
   fileSystem: FSModule;
   basePath: string;
@@ -25,24 +25,21 @@ export type FileSystemViewDirectoryNodeProps = {
   refreshParentDirectory: () => void;
 };
 
-const FileSystemViewDirectoryNode: React.FC<FileSystemViewDirectoryNodeProps> = (
-  props: FileSystemViewDirectoryNodeProps
-) => {
-  const {
-    workspaceLocation,
-    fileSystem,
-    basePath,
-    directoryName,
-    indentationLevel,
-    refreshParentDirectory
-  } = props;
+const FileSystemViewDirectoryNode: React.FC<Props> = ({
+  workspaceLocation,
+  fileSystem,
+  basePath,
+  directoryName,
+  indentationLevel,
+  refreshParentDirectory
+}) => {
   const fullPath = path.join(basePath, directoryName);
 
-  const [isExpanded, setIsExpanded] = React.useState<boolean>(false);
-  const [isEditing, setIsEditing] = React.useState<boolean>(false);
-  const [isAddingNewFile, setIsAddingNewFile] = React.useState<boolean>(false);
-  const [isAddingNewDirectory, setIsAddingNewDirectory] = React.useState<boolean>(false);
-  const [fileSystemViewListKey, setFileSystemViewListKey] = React.useState<number>(0);
+  const [isExpanded, setIsExpanded] = React.useState(false);
+  const [isEditing, setIsEditing] = React.useState(false);
+  const [isAddingNewFile, setIsAddingNewFile] = React.useState(false);
+  const [isAddingNewDirectory, setIsAddingNewDirectory] = React.useState(false);
+  const [fileSystemViewListKey, setFileSystemViewListKey] = React.useState(0);
   const dispatch = useDispatch();
 
   const toggleIsExpanded = () => {
diff --git a/src/commons/fileSystemView/FileSystemViewFileName.tsx b/src/commons/fileSystemView/FileSystemViewFileName.tsx
index 12aee8c411..d1611a64b6 100644
--- a/src/commons/fileSystemView/FileSystemViewFileName.tsx
+++ b/src/commons/fileSystemView/FileSystemViewFileName.tsx
@@ -11,7 +11,7 @@ import {
 } from '../workspace/WorkspaceActions';
 import { WorkspaceLocation } from '../workspace/WorkspaceTypes';
 
-export type FileSystemViewFileNameProps = {
+type Props = {
   workspaceLocation: WorkspaceLocation;
   fileSystem: FSModule;
   basePath: string;
@@ -22,21 +22,17 @@ export type FileSystemViewFileNameProps = {
   refreshDirectory: () => void;
 };
 
-const FileSystemViewFileName: React.FC<FileSystemViewFileNameProps> = (
-  props: FileSystemViewFileNameProps
-) => {
-  const {
-    workspaceLocation,
-    fileSystem,
-    basePath,
-    fileName,
-    isDirectory,
-    isEditing,
-    setIsEditing,
-    refreshDirectory
-  } = props;
-
-  const [editedFileName, setEditedFileName] = React.useState<string>(fileName);
+const FileSystemViewFileName: React.FC<Props> = ({
+  workspaceLocation,
+  fileSystem,
+  basePath,
+  fileName,
+  isDirectory,
+  isEditing,
+  setIsEditing,
+  refreshDirectory
+}) => {
+  const [editedFileName, setEditedFileName] = React.useState(fileName);
   const dispatch = useDispatch();
 
   const handleInputOnChange = (e: React.ChangeEvent<HTMLInputElement>) =>
diff --git a/src/commons/fileSystemView/FileSystemViewFileNode.tsx b/src/commons/fileSystemView/FileSystemViewFileNode.tsx
index 489a76e778..99136f4447 100644
--- a/src/commons/fileSystemView/FileSystemViewFileNode.tsx
+++ b/src/commons/fileSystemView/FileSystemViewFileNode.tsx
@@ -13,7 +13,7 @@ import FileSystemViewContextMenu from './FileSystemViewContextMenu';
 import FileSystemViewFileName from './FileSystemViewFileName';
 import FileSystemViewIndentationPadding from './FileSystemViewIndentationPadding';
 
-export type FileSystemViewFileNodeProps = {
+type Props = {
   workspaceLocation: WorkspaceLocation;
   fileSystem: FSModule;
   basePath: string;
@@ -22,13 +22,15 @@ export type FileSystemViewFileNodeProps = {
   refreshDirectory: () => void;
 };
 
-const FileSystemViewFileNode: React.FC<FileSystemViewFileNodeProps> = (
-  props: FileSystemViewFileNodeProps
-) => {
-  const { workspaceLocation, fileSystem, basePath, fileName, indentationLevel, refreshDirectory } =
-    props;
-
-  const [isEditing, setIsEditing] = React.useState<boolean>(false);
+const FileSystemViewFileNode: React.FC<Props> = ({
+  workspaceLocation,
+  fileSystem,
+  basePath,
+  fileName,
+  indentationLevel,
+  refreshDirectory
+}) => {
+  const [isEditing, setIsEditing] = React.useState(false);
   const dispatch = useDispatch();
 
   const fullPath = path.join(basePath, fileName);
diff --git a/src/commons/fileSystemView/FileSystemViewIndentationPadding.tsx b/src/commons/fileSystemView/FileSystemViewIndentationPadding.tsx
index eae7adb6a8..004e3f63a2 100644
--- a/src/commons/fileSystemView/FileSystemViewIndentationPadding.tsx
+++ b/src/commons/fileSystemView/FileSystemViewIndentationPadding.tsx
@@ -1,16 +1,12 @@
 import React from 'react';
 
-export type FileSystemViewIndentationPaddingProps = {
+type Props = {
   indentationLevel: number;
 };
 
 const SPACING_PER_LEVEL = 19;
 
-const FileSystemViewIndentationPadding: React.FC<FileSystemViewIndentationPaddingProps> = (
-  props: FileSystemViewIndentationPaddingProps
-) => {
-  const { indentationLevel } = props;
-
+const FileSystemViewIndentationPadding: React.FC<Props> = ({ indentationLevel }) => {
   const indentationStyle: React.CSSProperties = {
     paddingLeft: `${SPACING_PER_LEVEL * indentationLevel}px`
   };
diff --git a/src/commons/fileSystemView/FileSystemViewList.tsx b/src/commons/fileSystemView/FileSystemViewList.tsx
index 1b2ed2daa4..b49462853a 100644
--- a/src/commons/fileSystemView/FileSystemViewList.tsx
+++ b/src/commons/fileSystemView/FileSystemViewList.tsx
@@ -9,16 +9,19 @@ import { WorkspaceLocation } from '../workspace/WorkspaceTypes';
 import FileSystemViewDirectoryNode from './FileSystemViewDirectoryNode';
 import FileSystemViewFileNode from './FileSystemViewFileNode';
 
-export type FileSystemViewListProps = {
+type Props = {
   workspaceLocation: WorkspaceLocation;
   fileSystem: FSModule;
   basePath: string;
   indentationLevel: number;
 };
 
-const FileSystemViewList: React.FC<FileSystemViewListProps> = (props: FileSystemViewListProps) => {
-  const { workspaceLocation, fileSystem, basePath, indentationLevel } = props;
-
+const FileSystemViewList: React.FC<Props> = ({
+  workspaceLocation,
+  fileSystem,
+  basePath,
+  indentationLevel
+}) => {
   const [dirNames, setDirNames] = React.useState<string[] | undefined>(undefined);
   const [fileNames, setFileNames] = React.useState<string[] | undefined>(undefined);
 
diff --git a/src/commons/fileSystemView/FileSystemViewPlaceholderNode.tsx b/src/commons/fileSystemView/FileSystemViewPlaceholderNode.tsx
index ffeca549ca..3a985c323e 100644
--- a/src/commons/fileSystemView/FileSystemViewPlaceholderNode.tsx
+++ b/src/commons/fileSystemView/FileSystemViewPlaceholderNode.tsx
@@ -1,17 +1,13 @@
 import React from 'react';
 import classes from 'src/styles/FileSystemView.module.scss';
 
-export type FileSystemViewPlaceholderNodeProps = {
+type Props = {
   processFileName: (fileName: string) => void;
   removePlaceholder: () => void;
 };
 
-const FileSystemViewPlaceholderNode: React.FC<FileSystemViewPlaceholderNodeProps> = (
-  props: FileSystemViewPlaceholderNodeProps
-) => {
-  const { processFileName, removePlaceholder } = props;
-
-  const [fileName, setFileName] = React.useState<string>('');
+const FileSystemViewPlaceholderNode: React.FC<Props> = ({ processFileName, removePlaceholder }) => {
+  const [fileName, setFileName] = React.useState('');
 
   const handleInputOnChange = (e: React.ChangeEvent<HTMLInputElement>) =>
     setFileName(e.target.value);
diff --git a/src/commons/mobileWorkspace/DraggableRepl.tsx b/src/commons/mobileWorkspace/DraggableRepl.tsx
index 9f6d1bcd41..f0001cb648 100644
--- a/src/commons/mobileWorkspace/DraggableRepl.tsx
+++ b/src/commons/mobileWorkspace/DraggableRepl.tsx
@@ -3,14 +3,14 @@ import Draggable, { DraggableEventHandler } from 'react-draggable';
 
 import Repl, { ReplProps } from '../repl/Repl';
 
-type DraggableReplProps = {
+type Props = {
   position: { x: number; y: number };
   onDrag: DraggableEventHandler;
   disabled: boolean;
   replProps: ReplProps;
 };
 
-const DraggableRepl: React.FC<DraggableReplProps> = (props: DraggableReplProps) => {
+const DraggableRepl: React.FC<Props> = props => {
   return (
     <Draggable
       axis="y"
diff --git a/src/commons/mobileWorkspace/MobileKeyboard.tsx b/src/commons/mobileWorkspace/MobileKeyboard.tsx
index fe8554b23d..02ae5def0d 100644
--- a/src/commons/mobileWorkspace/MobileKeyboard.tsx
+++ b/src/commons/mobileWorkspace/MobileKeyboard.tsx
@@ -3,13 +3,11 @@ import React from 'react';
 import Draggable, { DraggableEvent, DraggableEventHandler } from 'react-draggable';
 import Keyboard from 'react-simple-keyboard';
 
-export type MobileKeyboardProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   targetKeyboardInput: Ace.Editor | null;
 };
 
-const MobileKeyboard: React.FC<MobileKeyboardProps> = props => {
+const MobileKeyboard: React.FC<Props> = props => {
   const [isKeyboardShown, setIsKeyoardShown] = React.useState(false);
   const [buttonContent, setButtonContent] = React.useState('ᐸ');
   const [keyboardPosition, setKeyboardPosition] = React.useState({ x: 0, y: 0 });
diff --git a/src/commons/mobileWorkspace/MobileWorkspace.tsx b/src/commons/mobileWorkspace/MobileWorkspace.tsx
index 68a8351f5f..42d20b7979 100644
--- a/src/commons/mobileWorkspace/MobileWorkspace.tsx
+++ b/src/commons/mobileWorkspace/MobileWorkspace.tsx
@@ -16,9 +16,7 @@ import DraggableRepl from './DraggableRepl';
 import MobileKeyboard from './MobileKeyboard';
 import MobileSideContent, { MobileSideContentProps } from './mobileSideContent/MobileSideContent';
 
-export type MobileWorkspaceProps = StateProps;
-
-type StateProps = {
+export type MobileWorkspaceProps = {
   editorContainerProps?: EditorContainerProps; // Either editorProps or mcqProps must be provided
   hasUnsavedChanges?: boolean; // Not used in Playground
   mcqProps?: McqChooserProps; // Not used in Playground
diff --git a/src/commons/mocks/StoreMocks.ts b/src/commons/mocks/StoreMocks.ts
index 7ba02a5b3e..1f14b69822 100644
--- a/src/commons/mocks/StoreMocks.ts
+++ b/src/commons/mocks/StoreMocks.ts
@@ -3,7 +3,6 @@ import { DeepPartial, Store } from 'redux';
 import mockStore from 'redux-mock-store';
 
 import {
-  defaultAcademy,
   defaultAchievement,
   defaultDashboard,
   defaultFileSystem,
@@ -20,7 +19,6 @@ export function mockInitialStore(overrides?: DeepPartial<OverallState>): Store<O
   const createStore = (mockStore as any)();
   const state: OverallState = {
     router: defaultRouter,
-    academy: defaultAcademy,
     achievement: defaultAchievement,
     dashboard: defaultDashboard,
     playground: defaultPlayground,
diff --git a/src/commons/navigationBar/__tests__/NavigationBar.tsx b/src/commons/navigationBar/__tests__/NavigationBar.tsx
index 92e3bd23e7..ba1e839558 100644
--- a/src/commons/navigationBar/__tests__/NavigationBar.tsx
+++ b/src/commons/navigationBar/__tests__/NavigationBar.tsx
@@ -1,5 +1,5 @@
-import { useSelector } from 'react-redux';
 import { useLocation } from 'react-router-dom';
+import { useTypedSelector } from 'src/commons/utils/Hooks';
 import { shallowRender } from 'src/commons/utils/TestUtils';
 
 import { Role } from '../../application/ApplicationTypes';
@@ -14,7 +14,7 @@ jest.mock('react-redux', () => ({
   useSelector: jest.fn()
 }));
 
-const useSelectorMock = useSelector as jest.Mock;
+const useSelectorMock = useTypedSelector as jest.Mock;
 const useLocationMock = useLocation as jest.Mock;
 
 describe('NavigationBar', () => {
diff --git a/src/commons/navigationBar/subcomponents/AcademyNavigationBar.tsx b/src/commons/navigationBar/subcomponents/AcademyNavigationBar.tsx
index 9644bd177a..2d35125653 100644
--- a/src/commons/navigationBar/subcomponents/AcademyNavigationBar.tsx
+++ b/src/commons/navigationBar/subcomponents/AcademyNavigationBar.tsx
@@ -8,11 +8,11 @@ import { assessmentTypeLink } from 'src/commons/utils/ParamParseHelper';
 import { Role } from '../../application/ApplicationTypes';
 import { createDesktopNavlink, NavbarEntryInfo, renderNavlinksFromInfo } from '../NavigationBar';
 
-type OwnProps = {
+type Props = {
   assessmentTypes?: AssessmentType[];
 };
 
-const AcademyNavigationBar: React.FunctionComponent<OwnProps> = ({ assessmentTypes }) => {
+const AcademyNavigationBar: React.FC<Props> = ({ assessmentTypes }) => {
   const { role, courseId } = useSession();
   const isEnrolledInACourse = !!role;
 
diff --git a/src/commons/navigationBar/subcomponents/__tests__/AcademyNavigationBar.tsx b/src/commons/navigationBar/subcomponents/__tests__/AcademyNavigationBar.tsx
index 1256b291a7..8778b2c6b7 100644
--- a/src/commons/navigationBar/subcomponents/__tests__/AcademyNavigationBar.tsx
+++ b/src/commons/navigationBar/subcomponents/__tests__/AcademyNavigationBar.tsx
@@ -1,4 +1,4 @@
-import { useSelector } from 'react-redux';
+import { useTypedSelector } from 'src/commons/utils/Hooks';
 import { deepFilter, shallowRender } from 'src/commons/utils/TestUtils';
 
 import { Role } from '../../../application/ApplicationTypes';
@@ -8,7 +8,7 @@ jest.mock('react-redux', () => ({
   ...jest.requireActual('react-redux'),
   useSelector: jest.fn()
 }));
-const useSelectorMock = useSelector as jest.Mock;
+const useSelectorMock = useTypedSelector as jest.Mock;
 
 const assessmentTypes = ['Missions', 'Quests', 'Paths', 'Contests', 'Others'];
 const staffRoutes = ['grading', 'groundcontrol', 'sourcereel', 'gamesimulator', 'dashboard'];
diff --git a/src/commons/notificationBadge/NotificationBadge.tsx b/src/commons/notificationBadge/NotificationBadge.tsx
index e6c3a38f73..10625477e5 100644
--- a/src/commons/notificationBadge/NotificationBadge.tsx
+++ b/src/commons/notificationBadge/NotificationBadge.tsx
@@ -8,16 +8,14 @@ import { useSession } from '../utils/Hooks';
 import { filterNotificationsById } from './NotificationBadgeHelper';
 import { Notification, NotificationType, NotificationTypes } from './NotificationBadgeTypes';
 
-type NotificationBadgeProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   className?: string;
   disableHover?: boolean; // Set to true to disable popover content
   large?: boolean; // Set to true to use large style
   notificationFilter?: (notifications: Notification[]) => Notification[];
 };
 
-const NotificationBadge: React.FC<NotificationBadgeProps> = props => {
+const NotificationBadge: React.FC<Props> = props => {
   const dispatch = useDispatch();
   const { notifications: initialNotifications } = useSession();
 
diff --git a/src/commons/repl/Repl.tsx b/src/commons/repl/Repl.tsx
index 98ef021922..4cc233ab6e 100644
--- a/src/commons/repl/Repl.tsx
+++ b/src/commons/repl/Repl.tsx
@@ -38,7 +38,7 @@ type OwnProps = {
   replButtons: Array<JSX.Element | null>;
 };
 
-const Repl: React.FC<ReplProps> = (props: ReplProps) => {
+const Repl: React.FC<ReplProps> = props => {
   const cards = props.output.map((slice, index) => (
     <Output
       output={slice}
@@ -64,7 +64,7 @@ const Repl: React.FC<ReplProps> = (props: ReplProps) => {
   );
 };
 
-export const Output: React.FC<OutputProps> = (props: OutputProps) => {
+export const Output: React.FC<OutputProps> = props => {
   switch (props.output.type) {
     case 'code':
       return (
diff --git a/src/commons/repl/ReplInput.tsx b/src/commons/repl/ReplInput.tsx
index 83bc5ea1b3..73ddaee98a 100644
--- a/src/commons/repl/ReplInput.tsx
+++ b/src/commons/repl/ReplInput.tsx
@@ -34,7 +34,7 @@ type OwnProps = {
   replButtons: Array<JSX.Element | null>;
 };
 
-export const ReplInput: React.FC<ReplInputProps> = (props: ReplInputProps) => {
+export const ReplInput: React.FC<ReplInputProps> = props => {
   const { onFocus, onBlur } = props;
 
   const replInput = React.useRef<ReactAce>(null);
diff --git a/src/commons/sagas/AchievementSaga.ts b/src/commons/sagas/AchievementSaga.ts
index fc97c02ecb..f455545116 100644
--- a/src/commons/sagas/AchievementSaga.ts
+++ b/src/commons/sagas/AchievementSaga.ts
@@ -196,10 +196,10 @@ export default function* AchievementSaga(): SagaIterator {
       // Flash the home icon if there is an error and the user is in the CSE machine or subst viz tab
       const introIcon = document.getElementById(SideContentType.introduction + '-icon');
       const cseTab = document.getElementById(
-        'bp4-tab-panel_side-content-tabs_' + SideContentType.cseMachine
+        'bp5-tab-panel_side-content-tabs_' + SideContentType.cseMachine
       );
       const substTab = document.getElementById(
-        'bp4-tab-panel_side-content-tabs_' + SideContentType.substVisualizer
+        'bp5-tab-panel_side-content-tabs_' + SideContentType.substVisualizer
       );
       if (
         (cseTab && cseTab.ariaHidden === 'false') ||
diff --git a/src/commons/sideBar/SideBar.tsx b/src/commons/sideBar/SideBar.tsx
index e18d5083da..39c9813dae 100644
--- a/src/commons/sideBar/SideBar.tsx
+++ b/src/commons/sideBar/SideBar.tsx
@@ -18,17 +18,15 @@ export type SideBarTab = {
   id?: SideContentType;
 };
 
-export type SideBarProps = {
+type Props = {
   tabs: SideBarTab[];
   isExpanded: boolean;
   expandSideBar: () => void;
   collapseSideBar: () => void;
 };
 
-const SideBar: React.FC<SideBarProps> = (props: SideBarProps) => {
-  const { tabs, isExpanded, expandSideBar, collapseSideBar } = props;
-
-  const [selectedTabIndex, setSelectedTabIndex] = React.useState<number>(0);
+const SideBar: React.FC<Props> = ({ tabs, isExpanded, expandSideBar, collapseSideBar }) => {
+  const [selectedTabIndex, setSelectedTabIndex] = React.useState(0);
 
   const handleTabSelection = (tabIndex: number) => {
     if (selectedTabIndex === tabIndex) {
diff --git a/src/commons/sideContent/SideContentHelper.ts b/src/commons/sideContent/SideContentHelper.ts
index de02c6affd..27b747432b 100644
--- a/src/commons/sideContent/SideContentHelper.ts
+++ b/src/commons/sideContent/SideContentHelper.ts
@@ -1,7 +1,7 @@
-import * as bp3core from '@blueprintjs/core';
+import * as bpcore from '@blueprintjs/core';
 import { TabId } from '@blueprintjs/core';
-import * as bp3icons from '@blueprintjs/icons';
-import * as bp3popover from '@blueprintjs/popover2';
+import * as bpicons from '@blueprintjs/icons';
+import * as bppopover from '@blueprintjs/popover2';
 import * as jsslang from 'js-slang';
 import * as jsslangDist from 'js-slang/dist';
 import lodash from 'lodash';
@@ -32,9 +32,9 @@ const requireProvider = (x: string) => {
     'react/jsx-runtime': JSXRuntime,
     'react-ace': ace,
     'react-dom': ReactDOM,
-    '@blueprintjs/core': bp3core,
-    '@blueprintjs/icons': bp3icons,
-    '@blueprintjs/popover2': bp3popover,
+    '@blueprintjs/core': bpcore,
+    '@blueprintjs/icons': bpicons,
+    '@blueprintjs/popover2': bppopover,
     'js-slang': jsslang,
     'js-slang/dist': jsslangDist,
     lodash,
diff --git a/src/commons/sideContent/content/SideContentAutograder.tsx b/src/commons/sideContent/content/SideContentAutograder.tsx
index 6560daaa68..698ddeb473 100644
--- a/src/commons/sideContent/content/SideContentAutograder.tsx
+++ b/src/commons/sideContent/content/SideContentAutograder.tsx
@@ -28,9 +28,9 @@ type OwnProps = {
   workspaceLocation: WorkspaceLocation;
 };
 
-const SideContentAutograder: React.FunctionComponent<SideContentAutograderProps> = props => {
-  const [showsTestcases, setTestcasesShown] = React.useState<boolean>(true);
-  const [showsResults, setResultsShown] = React.useState<boolean>(true);
+const SideContentAutograder: React.FC<SideContentAutograderProps> = props => {
+  const [showsTestcases, setTestcasesShown] = React.useState(true);
+  const [showsResults, setResultsShown] = React.useState(true);
 
   const { testcases, autogradingResults, handleTestcaseEval, workspaceLocation } = props;
 
diff --git a/src/commons/sideContent/content/SideContentCanvasOutput.tsx b/src/commons/sideContent/content/SideContentCanvasOutput.tsx
index 2b5d356857..cf5deda5a4 100644
--- a/src/commons/sideContent/content/SideContentCanvasOutput.tsx
+++ b/src/commons/sideContent/content/SideContentCanvasOutput.tsx
@@ -1,8 +1,6 @@
 import React, { useEffect, useRef } from 'react';
 
-type SideContentCanvasOutputProps = StateProps;
-
-type StateProps = {
+type Props = {
   canvas: HTMLCanvasElement;
 };
 
@@ -10,7 +8,7 @@ type StateProps = {
  * Takes the output of the rendered graphics (in a hidden canvas tag under <body>)
  * and makes it into a new <canvas> output for viewing.
  */
-const SideContentCanvasOutput: React.FC<SideContentCanvasOutputProps> = ({ canvas }) => {
+const SideContentCanvasOutput: React.FC<Props> = ({ canvas }) => {
   const parentRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
diff --git a/src/commons/sideContent/content/SideContentContestLeaderboard.tsx b/src/commons/sideContent/content/SideContentContestLeaderboard.tsx
index d678400f15..d072cc3131 100644
--- a/src/commons/sideContent/content/SideContentContestLeaderboard.tsx
+++ b/src/commons/sideContent/content/SideContentContestLeaderboard.tsx
@@ -26,11 +26,9 @@ type StateProps = {
  * @param props {orderedContestEntries: an ordered list by desc score of leaderboard entries to display,
  *  handleContestEntryClick: displays contest entry answer in assessment workspace editor}
  */
-const SideContentContestLeaderboard: React.FunctionComponent<
-  SideContentContestLeaderboardProps
-> = props => {
+const SideContentContestLeaderboard: React.FC<SideContentContestLeaderboardProps> = props => {
   const { orderedContestEntries, handleContestEntryClick, leaderboardType } = props;
-  const [showLeaderboard, setShowLeaderboard] = useState<boolean>(true);
+  const [showLeaderboard, setShowLeaderboard] = useState(true);
 
   /**
    * Contest Leaderboard inner components
diff --git a/src/commons/sideContent/content/SideContentContestVoting.tsx b/src/commons/sideContent/content/SideContentContestVoting.tsx
index 15b58cb9a9..f6c12fe6f6 100644
--- a/src/commons/sideContent/content/SideContentContestVoting.tsx
+++ b/src/commons/sideContent/content/SideContentContestVoting.tsx
@@ -6,7 +6,7 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 
 import { ContestEntry } from '../../assessment/AssessmentTypes';
 
-export type SideContentContestVotingProps = DispatchProps & StateProps;
+type SideContentContestVotingProps = DispatchProps & StateProps;
 
 type DispatchProps = {
   handleContestEntryClick: (submissionId: number, answer: string) => void;
@@ -28,15 +28,14 @@ const TIERS = [
   { name: 'D', color: 'rgb(127, 191, 255)', score: 1 }
 ];
 
-const SideContentContestVoting: React.FunctionComponent<SideContentContestVotingProps> = props => {
-  const {
-    contestEntries,
-    canSave,
-    isValid,
-    handleContestEntryClick,
-    handleVotingSubmissionChange
-  } = props;
-  const [showContestEntries, setShowContestEntries] = useState<boolean>(true);
+const SideContentContestVoting: React.FC<SideContentContestVotingProps> = ({
+  contestEntries,
+  canSave,
+  isValid,
+  handleContestEntryClick,
+  handleVotingSubmissionChange
+}) => {
+  const [showContestEntries, setShowContestEntries] = useState(true);
   const [currentDraggedItem, setCurrentDraggedItem] = useState<HTMLElement | null>(null);
   const [hoveredTier, setHoveredTier] = useState<string | null>(null);
 
diff --git a/src/commons/sideContent/content/SideContentContestVotingContainer.tsx b/src/commons/sideContent/content/SideContentContestVotingContainer.tsx
index 8aaa379a37..85bac3f44e 100644
--- a/src/commons/sideContent/content/SideContentContestVotingContainer.tsx
+++ b/src/commons/sideContent/content/SideContentContestVotingContainer.tsx
@@ -20,11 +20,13 @@ type StateProps = {
  * Container to separate behaviour concerns from rendering concerns
  * Stores component-level voting ranking state
  */
-const SideContentContestVotingContainer: React.FunctionComponent<
-  SideContentContestVotingContainerProps
-> = props => {
-  const { canSave, contestEntries, handleSave, handleContestEntryClick } = props;
-  const [isValid, setIsValid] = useState<boolean>(true);
+const SideContentContestVotingContainer: React.FC<SideContentContestVotingContainerProps> = ({
+  canSave,
+  contestEntries,
+  handleSave,
+  handleContestEntryClick
+}) => {
+  const [isValid, setIsValid] = useState(true);
   const [votingSubmission, setVotingSubmission] = useState<ContestEntry[]>([]);
 
   useEffect(() => {
diff --git a/src/commons/sideContent/content/SideContentDataVisualizer.tsx b/src/commons/sideContent/content/SideContentDataVisualizer.tsx
index a7516b3d8e..4b991f216d 100644
--- a/src/commons/sideContent/content/SideContentDataVisualizer.tsx
+++ b/src/commons/sideContent/content/SideContentDataVisualizer.tsx
@@ -96,7 +96,7 @@ class SideContentDataVisualizerBase extends React.Component<OwnProps & DispatchP
               >
                 Previous
               </Button>
-              <h3 className="bp4-text-large">
+              <h3 className="bp5-text-large">
                 Call {this.state.currentStep + 1}/{this.state.steps.length}
               </h3>
               <Button
@@ -130,7 +130,7 @@ class SideContentDataVisualizerBase extends React.Component<OwnProps & DispatchP
                   <Card style={{ background: '#1a2530', padding: 10 }}>
                     {step.length > 1 && (
                       <h5
-                        className="bp4-heading bp4-monospace-text"
+                        className="bp5-heading bp5-monospace-text"
                         style={{ marginTop: 0, marginBottom: 20, whiteSpace: 'nowrap' }}
                       >
                         Structure {i + 1}
diff --git a/src/commons/sideContent/content/SideContentLeaderboardCard.tsx b/src/commons/sideContent/content/SideContentLeaderboardCard.tsx
index 77abb98ab5..f96b7b457c 100644
--- a/src/commons/sideContent/content/SideContentLeaderboardCard.tsx
+++ b/src/commons/sideContent/content/SideContentLeaderboardCard.tsx
@@ -15,11 +15,11 @@ type StateProps = {
   rank: number;
 };
 
-const SideContentLeaderboardCard: React.FunctionComponent<
-  SideContentLeaderboardCardProps
-> = props => {
-  const { handleContestEntryClick, contestEntry, rank } = props;
-
+const SideContentLeaderboardCard: React.FC<SideContentLeaderboardCardProps> = ({
+  handleContestEntryClick,
+  contestEntry,
+  rank
+}) => {
   return (
     <div className={classNames('LeaderboardCard')}>
       <Card
diff --git a/src/commons/sideContent/content/SideContentResultCard.tsx b/src/commons/sideContent/content/SideContentResultCard.tsx
index 34ea9ad3fd..1a0b984fb4 100644
--- a/src/commons/sideContent/content/SideContentResultCard.tsx
+++ b/src/commons/sideContent/content/SideContentResultCard.tsx
@@ -4,13 +4,6 @@ import React from 'react';
 
 import { AutogradingError, AutogradingResult } from '../../assessment/AssessmentTypes';
 
-type SideContentResultCardProps = StateProps;
-
-type StateProps = {
-  index: number;
-  result: AutogradingResult;
-};
-
 const buildErrorString = (errors: AutogradingError[]) =>
   errors
     .map(error => {
@@ -29,9 +22,12 @@ const buildErrorString = (errors: AutogradingError[]) =>
     })
     .join('\n\n');
 
-const SideContentResultCard: React.FunctionComponent<SideContentResultCardProps> = props => {
-  const { index, result } = props;
+type Props = {
+  index: number;
+  result: AutogradingResult;
+};
 
+const SideContentResultCard: React.FC<Props> = ({ index, result }) => {
   return (
     <div
       className={classNames('ResultCard', result.resultType === 'pass' ? 'correct' : 'wrong')}
diff --git a/src/commons/sideContent/content/SideContentTestcaseCard.tsx b/src/commons/sideContent/content/SideContentTestcaseCard.tsx
index 7047b65143..7222aae4fa 100644
--- a/src/commons/sideContent/content/SideContentTestcaseCard.tsx
+++ b/src/commons/sideContent/content/SideContentTestcaseCard.tsx
@@ -22,7 +22,7 @@ type OwnProps = {
   workspaceLocation: WorkspaceLocation;
 };
 
-const SideContentTestcaseCard: React.FunctionComponent<SideContentTestcaseCardProps> = props => {
+const SideContentTestcaseCard: React.FC<SideContentTestcaseCardProps> = props => {
   const { index, testcase, handleTestcaseEval } = props;
 
   const extraClasses = React.useMemo(() => {
diff --git a/src/commons/sideContent/content/githubAssessments/SideContentEditableTestcaseCard.tsx b/src/commons/sideContent/content/githubAssessments/SideContentEditableTestcaseCard.tsx
index 36778d268a..2407f595eb 100644
--- a/src/commons/sideContent/content/githubAssessments/SideContentEditableTestcaseCard.tsx
+++ b/src/commons/sideContent/content/githubAssessments/SideContentEditableTestcaseCard.tsx
@@ -21,18 +21,14 @@ type StateProps = {
   testcase: Testcase;
 };
 
-const SideContentEditableTestcaseCard: React.FunctionComponent<
-  SideContentEditableTestcaseCardProps
-> = props => {
-  const {
-    index,
-    testcase,
-    setTestcaseProgram,
-    setTestcaseExpectedResult,
-    handleTestcaseEval,
-    deleteTestcase
-  } = props;
-
+const SideContentEditableTestcaseCard: React.FC<SideContentEditableTestcaseCardProps> = ({
+  index,
+  testcase,
+  setTestcaseProgram,
+  setTestcaseExpectedResult,
+  handleTestcaseEval,
+  deleteTestcase
+}) => {
   // TODO (Refactor): testcase type seems unused in GitHub Assessments
   const extraClasses = React.useMemo(() => {
     const isEvaluated = testcase.result !== undefined || testcase.errors;
diff --git a/src/commons/sideContent/content/githubAssessments/SideContentMarkdownEditor.tsx b/src/commons/sideContent/content/githubAssessments/SideContentMarkdownEditor.tsx
index 438d5de7b3..ccbea9044d 100644
--- a/src/commons/sideContent/content/githubAssessments/SideContentMarkdownEditor.tsx
+++ b/src/commons/sideContent/content/githubAssessments/SideContentMarkdownEditor.tsx
@@ -3,15 +3,14 @@ import React, { useEffect } from 'react';
 
 import Markdown from '../../../Markdown';
 
-export type SideContentMarkdownEditorProps = {
+type Props = {
   allowEdits: boolean;
   content: string;
   setContent: (content: string) => void;
 };
 
-const SideContentMarkdownEditor: React.FC<SideContentMarkdownEditorProps> = props => {
+const SideContentMarkdownEditor: React.FC<Props> = ({ allowEdits, content, setContent }) => {
   const [editorModeOn, setEditorModeOn] = React.useState(false);
-  const allowEdits = props.allowEdits;
 
   const node = React.useRef() as any;
 
@@ -43,16 +42,16 @@ const SideContentMarkdownEditor: React.FC<SideContentMarkdownEditorProps> = prop
           onChange={onEditorChange}
           fill={true}
           growVertically={true}
-          defaultValue={props.content}
+          defaultValue={content}
         />
       ) : (
-        <Markdown content={props.content} openLinksInNewWindow={true} />
+        <Markdown content={content} openLinksInNewWindow={true} />
       )}
     </div>
   );
 
   function onEditorChange(event: any) {
-    props.setContent(event.target.value);
+    setContent(event.target.value);
   }
 };
 
diff --git a/src/commons/sideContent/content/githubAssessments/SideContentTaskEditor.tsx b/src/commons/sideContent/content/githubAssessments/SideContentTaskEditor.tsx
index cf66f3bbeb..c976652fe7 100644
--- a/src/commons/sideContent/content/githubAssessments/SideContentTaskEditor.tsx
+++ b/src/commons/sideContent/content/githubAssessments/SideContentTaskEditor.tsx
@@ -2,14 +2,14 @@ import React from 'react';
 
 import SideContentMarkdownEditor from './SideContentMarkdownEditor';
 
-export type SideContentTaskEditorProps = {
+type Props = {
   allowEdits: boolean;
   currentTaskNumber: number;
   taskDescriptions: any[];
   setTaskDescriptions: (newList: any[]) => void;
 };
 
-const SideContentTaskEditor: React.FC<SideContentTaskEditorProps> = props => {
+const SideContentTaskEditor: React.FC<Props> = props => {
   const taskIndex = props.currentTaskNumber - 1;
   const taskDescriptions = props.taskDescriptions;
   const setTaskDescriptions = props.setTaskDescriptions;
diff --git a/src/commons/sideContent/content/remoteExecution/DeviceMenuItemButtons.tsx b/src/commons/sideContent/content/remoteExecution/DeviceMenuItemButtons.tsx
index 0a68cd034e..9508ef854f 100644
--- a/src/commons/sideContent/content/remoteExecution/DeviceMenuItemButtons.tsx
+++ b/src/commons/sideContent/content/remoteExecution/DeviceMenuItemButtons.tsx
@@ -1,17 +1,13 @@
 import { Button } from '@blueprintjs/core';
 import React from 'react';
 
-type DeviceMenuItemProps = {
+type Props = {
   text?: React.ReactNode;
   handleDelete: React.MouseEventHandler;
   handleEdit: React.MouseEventHandler;
 };
 
-const DeviceMenuItemButtons: React.FC<DeviceMenuItemProps> = ({
-  text,
-  handleDelete,
-  handleEdit
-}) => {
+const DeviceMenuItemButtons: React.FC<Props> = ({ text, handleDelete, handleEdit }) => {
   return (
     <>
       {text}
diff --git a/src/commons/sourceRecorder/SourceRecorderEditor.tsx b/src/commons/sourceRecorder/SourceRecorderEditor.tsx
index bf3938146a..9342ee7ccb 100644
--- a/src/commons/sourceRecorder/SourceRecorderEditor.tsx
+++ b/src/commons/sourceRecorder/SourceRecorderEditor.tsx
@@ -206,7 +206,7 @@ class SourcecastEditor extends React.PureComponent<SourceRecorderEditorProps, {}
 
   public render() {
     return (
-      <HotKeys className="Editor bp4-card bp4-elevation-0" handlers={handlers}>
+      <HotKeys className="Editor bp5-card bp5-elevation-0" handlers={handlers}>
         <div className="row editor-react-ace">
           <AceEditor
             className="react-ace"
diff --git a/src/commons/sourceRecorder/SourceRecorderShareCell.tsx b/src/commons/sourceRecorder/SourceRecorderShareCell.tsx
index 6c6afc9ce7..783f9e2408 100644
--- a/src/commons/sourceRecorder/SourceRecorderShareCell.tsx
+++ b/src/commons/sourceRecorder/SourceRecorderShareCell.tsx
@@ -6,14 +6,12 @@ import * as CopyToClipboard from 'react-copy-to-clipboard';
 import { SourcecastData } from '../../features/sourceRecorder/SourceRecorderTypes';
 import ControlButton from '../ControlButton';
 
-type SourceRecorderShareCellProps = StateProps;
-
-type StateProps = {
+type Props = {
   data: SourcecastData;
   courseId?: number;
 };
 
-const SourceRecorderShareCell: React.FC<SourceRecorderShareCellProps> = props => {
+const SourceRecorderShareCell: React.FC<Props> = props => {
   const shareInputElem = useRef<HTMLInputElement>(null);
   const [shareURL] = useState<string>(
     `${window.location.protocol}//${window.location.host}/courses/${props.courseId}/sourcecast/${props.data.uid}`
diff --git a/src/commons/utils/Hooks.ts b/src/commons/utils/Hooks.ts
index 0ff64eb32d..2b306e8b3a 100644
--- a/src/commons/utils/Hooks.ts
+++ b/src/commons/utils/Hooks.ts
@@ -1,5 +1,9 @@
 import React, { RefObject } from 'react';
-import { TypedUseSelectorHook, useSelector } from 'react-redux';
+import {
+  TypedUseSelectorHook,
+  // eslint-disable-next-line no-restricted-imports
+  useSelector
+} from 'react-redux';
 import { useMediaQuery } from 'react-responsive';
 
 import { OverallState } from '../application/ApplicationTypes';
@@ -78,8 +82,8 @@ export const useTypedSelector: TypedUseSelectorHook<OverallState> = useSelector;
  */
 
 export const useDimensions = (ref: RefObject<HTMLElement>): [width: number, height: number] => {
-  const [width, setWidth] = React.useState<number>(0);
-  const [height, setHeight] = React.useState<number>(0);
+  const [width, setWidth] = React.useState(0);
+  const [height, setHeight] = React.useState(0);
 
   const resizeObserver = React.useMemo(
     () =>
diff --git a/src/commons/workspace/Workspace.tsx b/src/commons/workspace/Workspace.tsx
index 237365dedf..b15423a4cd 100644
--- a/src/commons/workspace/Workspace.tsx
+++ b/src/commons/workspace/Workspace.tsx
@@ -40,8 +40,8 @@ const Workspace: React.FC<WorkspaceProps> = props => {
   const maxDividerHeight = React.useRef<number | null>(null);
   const sideDividerDiv = React.useRef<HTMLDivElement | null>(null);
   const [contentContainerWidth] = useDimensions(contentContainerDiv);
-  const [expandedSideBarWidth, setExpandedSideBarWidth] = React.useState<number>(200);
-  const [isSideBarExpanded, setIsSideBarExpanded] = React.useState<boolean>(true);
+  const [expandedSideBarWidth, setExpandedSideBarWidth] = React.useState(200);
+  const [isSideBarExpanded, setIsSideBarExpanded] = React.useState(true);
 
   const sideBarCollapsedWidth = 40;
 
diff --git a/src/features/academy/AcademyReducer.ts b/src/features/academy/AcademyReducer.ts
deleted file mode 100644
index bc23a6c2de..0000000000
--- a/src/features/academy/AcademyReducer.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import { Reducer } from 'redux';
-
-import { defaultAcademy } from '../../commons/application/ApplicationTypes';
-import { LOG_OUT } from '../../commons/application/types/CommonsTypes';
-import { SourceActionType } from '../../commons/utils/ActionsHelper';
-import { AcademyState } from './AcademyTypes';
-
-export const AcademyReducer: Reducer<AcademyState> = (
-  state = defaultAcademy,
-  action: SourceActionType
-) => {
-  switch (action.type) {
-    case LOG_OUT:
-      return defaultAcademy;
-    default:
-      return state;
-  }
-};
diff --git a/src/features/academy/AcademyTypes.ts b/src/features/academy/AcademyTypes.ts
index 8cf09381af..8dcd3bbd3f 100644
--- a/src/features/academy/AcademyTypes.ts
+++ b/src/features/academy/AcademyTypes.ts
@@ -9,7 +9,3 @@ export const gradingRegExp = ':submissionId?/:questionId?';
 export const CREATE_COURSE = 'CREATE_COURSE';
 export const ADD_NEW_USERS_TO_COURSE = 'ADD_NEW_USERS_TO_COURSE';
 export const ADD_NEW_STORIES_USERS_TO_COURSE = 'ADD_STORIES_NEW_USERS_TO_COURSE';
-
-export type AcademyState = {
-  // readonly gameCanvas?: HTMLCanvasElement;
-};
diff --git a/src/features/academy/__tests__/AcademyReducer.ts b/src/features/academy/__tests__/AcademyReducer.ts
deleted file mode 100644
index 9518e88c8c..0000000000
--- a/src/features/academy/__tests__/AcademyReducer.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { defaultAcademy } from '../../../commons/application/ApplicationTypes';
-import { LOG_OUT } from '../../../commons/application/types/CommonsTypes';
-import { AcademyReducer } from '../AcademyReducer';
-import { AcademyState } from '../AcademyTypes';
-
-test('LOG_OUT works correctly on default academy', () => {
-  const action = {
-    type: LOG_OUT,
-    payload: {}
-  };
-  const result: AcademyState = AcademyReducer(defaultAcademy, action);
-
-  expect(result).toEqual(defaultAcademy);
-});
diff --git a/src/features/dataVisualizer/drawable/ArrowDrawable.tsx b/src/features/dataVisualizer/drawable/ArrowDrawable.tsx
index ee62c70699..1e3698c544 100644
--- a/src/features/dataVisualizer/drawable/ArrowDrawable.tsx
+++ b/src/features/dataVisualizer/drawable/ArrowDrawable.tsx
@@ -3,14 +3,17 @@ import { Arrow } from 'react-konva';
 
 import { Config } from '../Config';
 
-type ArrowConfig = { from: { x: number; y: number }; to: { x: number; y: number } };
+type Props = {
+  from: { x: number; y: number };
+  to: { x: number; y: number };
+};
 
 /**
  * Represents an arrow used to connect a parent node and a child node.
  *
  * Used with ArrayDrawable and FunctionDrawable.
  */
-const ArrowDrawable: React.FC<ArrowConfig> = props => {
+const ArrowDrawable: React.FC<Props> = props => {
   return (
     <Arrow
       key={props + ''}
diff --git a/src/features/dataVisualizer/drawable/BackwardArrowDrawable.tsx b/src/features/dataVisualizer/drawable/BackwardArrowDrawable.tsx
index 66f88a68fb..2f9f31053f 100644
--- a/src/features/dataVisualizer/drawable/BackwardArrowDrawable.tsx
+++ b/src/features/dataVisualizer/drawable/BackwardArrowDrawable.tsx
@@ -3,13 +3,16 @@ import { Arrow } from 'react-konva';
 
 import { Config } from '../Config';
 
-type ArrowConfig = { from: { x: number; y: number }; to: { x: number; y: number } };
+type Props = {
+  from: { x: number; y: number };
+  to: { x: number; y: number };
+};
 
 /**
  * Represents an arrow used to connect a parent node and a child node that has been drawn before,
  * that is positioned to the top left of the parent node.
  */
-const BackwardArrowDrawable: React.FC<ArrowConfig> = ({ from, to }) => {
+const BackwardArrowDrawable: React.FC<Props> = ({ from, to }) => {
   /*
    *  Connects a box to a previously known box, the arrow path is more complicated.
    *
diff --git a/src/features/game/utils/StyleUtils.ts b/src/features/game/utils/StyleUtils.ts
index ab7e078837..071cc14dbd 100644
--- a/src/features/game/utils/StyleUtils.ts
+++ b/src/features/game/utils/StyleUtils.ts
@@ -1,4 +1,4 @@
-import * as _ from 'lodash';
+import _ from 'lodash';
 
 import { screenSize } from '../commons/CommonConstants';
 
diff --git a/src/features/sicp/parser/ParseJson.tsx b/src/features/sicp/parser/ParseJson.tsx
index b507cf6506..cd9f1ce6e7 100644
--- a/src/features/sicp/parser/ParseJson.tsx
+++ b/src/features/sicp/parser/ParseJson.tsx
@@ -48,8 +48,7 @@ type AnchorLinkType = {
   top: number;
 };
 
-const AnchorLink: React.FC<AnchorLinkType> = props => {
-  const { refs, id, children, top } = props;
+const AnchorLink: React.FC<AnchorLinkType> = ({ refs, id, children, top }) => {
   return (
     <div className="sicp-anchor-link-container">
       {id && (
diff --git a/src/features/stories/storiesComponents/UserBlogContent.tsx b/src/features/stories/storiesComponents/UserBlogContent.tsx
index 7a1ff5bef9..ad4ccf2672 100644
--- a/src/features/stories/storiesComponents/UserBlogContent.tsx
+++ b/src/features/stories/storiesComponents/UserBlogContent.tsx
@@ -9,10 +9,6 @@ import { addStoryEnv, clearStoryEnv } from 'src/features/stories/StoriesActions'
 
 import { store } from '../../../pages/createStore';
 
-type UserBlogProps = {
-  fileContent: string;
-};
-
 export const DEFAULT_ENV = 'default';
 
 const YAML_HEADER = '---';
@@ -87,15 +83,19 @@ export function getYamlHeader(content: string): { header: string; content: strin
   };
 }
 
-const UserBlogContent: React.FC<UserBlogProps> = props => {
+type Props = {
+  fileContent: string;
+};
+
+const UserBlogContent: React.FC<Props> = ({ fileContent }) => {
   const [content, setContent] = useState('');
 
   useEffect(() => {
-    const { header, content } = getYamlHeader(props.fileContent);
+    const { header, content } = getYamlHeader(fileContent);
     setContent(content);
     store.dispatch(clearStoryEnv());
     handleHeaders(header);
-  }, [props.fileContent]);
+  }, [fileContent]);
 
   return content ? (
     <div className="userblogContent">
diff --git a/src/pages/academy/Academy.tsx b/src/pages/academy/Academy.tsx
index b15efdfb80..8f9a3514fb 100644
--- a/src/pages/academy/Academy.tsx
+++ b/src/pages/academy/Academy.tsx
@@ -28,7 +28,7 @@ import GroundControl from './groundControl/GroundControlContainer';
 import NotiPreference from './notiPreference/NotiPreference';
 import Sourcereel from './sourcereel/Sourcereel';
 
-const Academy: React.FC<{}> = () => {
+const Academy: React.FC = () => {
   const dispatch = useDispatch();
   React.useEffect(() => {
     dispatch(fetchNotifications());
@@ -88,7 +88,7 @@ const Academy: React.FC<{}> = () => {
   );
 };
 
-const CourseSelectingAcademy: React.FC<{}> = () => {
+const CourseSelectingAcademy: React.FC = () => {
   const dispatch = useDispatch();
   const navigate = useNavigate();
   const { courseId } = useSession();
diff --git a/src/pages/academy/adminPanel/AdminPanel.tsx b/src/pages/academy/adminPanel/AdminPanel.tsx
index 14b9b634bd..bc4fec9048 100644
--- a/src/pages/academy/adminPanel/AdminPanel.tsx
+++ b/src/pages/academy/adminPanel/AdminPanel.tsx
@@ -201,7 +201,7 @@ const AdminPanel: React.FC = () => {
     </div>
   );
 
-  return <ContentDisplay loadContentDispatch={() => {}} display={data} fullWidth={false} />;
+  return <ContentDisplay display={data} fullWidth={false} />;
 };
 
 export default AdminPanel;
diff --git a/src/pages/academy/adminPanel/subcomponents/CourseConfigPanel.tsx b/src/pages/academy/adminPanel/subcomponents/CourseConfigPanel.tsx
index 23203f0031..023c659038 100644
--- a/src/pages/academy/adminPanel/subcomponents/CourseConfigPanel.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/CourseConfigPanel.tsx
@@ -15,19 +15,17 @@ import { useResponsive } from 'src/commons/utils/Hooks';
 import { UpdateCourseConfiguration } from '../../../../commons/application/types/SessionTypes';
 import Markdown from '../../../../commons/Markdown';
 
-export type CourseConfigPanelProps = OwnProps;
-
-type OwnProps = {
-  courseConfiguration: UpdateCourseConfiguration;
-  setCourseConfiguration: (courseConfiguration: UpdateCourseConfiguration) => void;
-};
-
 export enum CourseHelpTextEditorTab {
   WRITE = 'WRITE',
   PREVIEW = 'PREVIEW'
 }
 
-const CourseConfigPanel: React.FC<CourseConfigPanelProps> = props => {
+type Props = {
+  courseConfiguration: UpdateCourseConfiguration;
+  setCourseConfiguration: (courseConfiguration: UpdateCourseConfiguration) => void;
+};
+
+const CourseConfigPanel: React.FC<Props> = props => {
   const { isMobileBreakpoint } = useResponsive();
   const [courseHelpTextSelectedTab, setCourseHelpTextSelectedTab] =
     React.useState<CourseHelpTextEditorTab>(CourseHelpTextEditorTab.WRITE);
diff --git a/src/pages/academy/adminPanel/subcomponents/NotificationConfigPanel.tsx b/src/pages/academy/adminPanel/subcomponents/NotificationConfigPanel.tsx
index 034b56ab43..008531d606 100644
--- a/src/pages/academy/adminPanel/subcomponents/NotificationConfigPanel.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/NotificationConfigPanel.tsx
@@ -94,7 +94,7 @@ const NotificationConfigPanel = () => {
     return params.data!.notificationType.forStaff ? 'Staff' : 'Student';
   };
 
-  const columnDefs: ColDef[] = [
+  const columnDefs: ColDef<NotificationConfiguration>[] = [
     {
       headerName: 'Notification Type',
       field: 'notificationType.name',
diff --git a/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/AssessmentConfigPanel.tsx b/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/AssessmentConfigPanel.tsx
index 0e471efac7..0871fb53af 100644
--- a/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/AssessmentConfigPanel.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/AssessmentConfigPanel.tsx
@@ -9,24 +9,26 @@ import {
 import { AgGridReact } from 'ag-grid-react';
 import { isEqual } from 'lodash';
 import React from 'react';
+import { AssessmentConfiguration } from 'src/commons/assessment/AssessmentTypes';
 import { showWarningMessage } from 'src/commons/utils/notifications/NotificationsHelper';
 
-import { AssessmentConfiguration } from '../../../../../commons/assessment/AssessmentTypes';
 import BooleanCell from './BooleanCell';
 import DeleteRowCell from './DeleteRowCell';
 import NumericCell from './NumericCell';
 
-export type AssessmentConfigPanelProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   assessmentConfig: React.MutableRefObject<AssessmentConfiguration[]>;
   setAssessmentConfig: (assessmentConfig: AssessmentConfiguration[]) => void;
   setAssessmentConfigsToDelete: (assessmentConfig: AssessmentConfiguration) => void;
   setHasChangesAssessmentConfig: (val: boolean) => void;
 };
 
-const AssessmentConfigPanel: React.FC<AssessmentConfigPanelProps> = props => {
-  const { assessmentConfig, setAssessmentConfig, setAssessmentConfigsToDelete } = props;
+const AssessmentConfigPanel: React.FC<Props> = ({
+  assessmentConfig,
+  setAssessmentConfig,
+  setAssessmentConfigsToDelete,
+  setHasChangesAssessmentConfig
+}) => {
   const gridApi = React.useRef<GridApi>();
 
   const setIsManuallyGraded = (index: number, value: boolean) => {
@@ -112,7 +114,7 @@ const AssessmentConfigPanel: React.FC<AssessmentConfigPanelProps> = props => {
     setAssessmentConfigsToDelete(deleted[0]);
   };
 
-  const columnDefs: ColDef[] = [
+  const columnDefs: ColDef<AssessmentConfiguration>[] = [
     {
       headerName: 'Assessment Type',
       field: 'type',
@@ -166,7 +168,7 @@ const AssessmentConfigPanel: React.FC<AssessmentConfigPanelProps> = props => {
     },
     {
       headerName: 'Delete Row',
-      field: 'placeholderToPreventColumnRerender',
+      field: 'placeholderToPreventColumnRerender' as any,
       cellRenderer: DeleteRowCell,
       cellRendererParams: {
         deleteRowHandler: deleteRowHandler
@@ -206,7 +208,7 @@ const AssessmentConfigPanel: React.FC<AssessmentConfigPanelProps> = props => {
   // cellRenderer)
   const onRowDragLeaveOrEnd = (event: RowDragEvent) => {
     gridApi.current?.setRowData(assessmentConfig.current);
-    props.setHasChangesAssessmentConfig(true);
+    setHasChangesAssessmentConfig(true);
   };
 
   // Updates our local React state whenever there are changes to the Assessment Type column
@@ -218,7 +220,7 @@ const AssessmentConfigPanel: React.FC<AssessmentConfigPanelProps> = props => {
         type: event.value
       };
       assessmentConfig.current = temp;
-      props.setHasChangesAssessmentConfig(true);
+      setHasChangesAssessmentConfig(true);
     }
   };
 
@@ -235,7 +237,7 @@ const AssessmentConfigPanel: React.FC<AssessmentConfigPanelProps> = props => {
         defaultColDef={defaultColumnDefs}
         onGridReady={onGridReady}
         onGridSizeChanged={() => gridApi.current?.sizeColumnsToFit()}
-        rowData={props.assessmentConfig.current}
+        rowData={assessmentConfig.current}
         rowHeight={36}
         rowDragManaged={true}
         suppressCellFocus={true}
diff --git a/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/BooleanCell.tsx b/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/BooleanCell.tsx
index 692d806675..3ed54b2ec2 100644
--- a/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/BooleanCell.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/BooleanCell.tsx
@@ -2,20 +2,18 @@ import { Switch } from '@blueprintjs/core';
 import React from 'react';
 import { KeysOfType } from 'src/commons/utils/TypeHelper';
 
-type BooleanCellProps = OwnProps;
-
 interface dataProps {
   [key: string]: boolean;
 }
 
-type OwnProps = {
+type Props = {
   data: dataProps;
   field: KeysOfType<dataProps, boolean>;
   rowIndex: number;
   setStateHandler: (index: number, value: boolean) => void;
 };
 
-const BooleanCell: React.FC<BooleanCellProps> = props => {
+const BooleanCell: React.FC<Props> = props => {
   const { data } = props;
   const checked = data[props.field];
 
diff --git a/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/NumericCell.tsx b/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/NumericCell.tsx
index d934810da0..c800de84cc 100644
--- a/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/NumericCell.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/assessmentConfigPanel/NumericCell.tsx
@@ -3,16 +3,14 @@ import React from 'react';
 import { AssessmentConfiguration } from 'src/commons/assessment/AssessmentTypes';
 import { KeysOfType } from 'src/commons/utils/TypeHelper';
 
-type NumericCellProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   data: AssessmentConfiguration;
   field: KeysOfType<AssessmentConfiguration, number>;
   rowIndex: number;
   setStateHandler: (index: number, value: number) => void;
 };
 
-const NumericCell: React.FC<NumericCellProps> = props => {
+const NumericCell: React.FC<Props> = props => {
   const { data } = props;
 
   const changeHandler = React.useCallback(
diff --git a/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/SelectCell.tsx b/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/SelectCell.tsx
index 5d94ac3390..b00cb203f8 100644
--- a/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/SelectCell.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/SelectCell.tsx
@@ -4,16 +4,14 @@ import React from 'react';
 import { NotificationConfiguration, TimeOption } from 'src/commons/application/types/SessionTypes';
 import { KeysOfType } from 'src/commons/utils/TypeHelper';
 
-type SelectCellProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   data: NotificationConfiguration;
   rowIndex: number;
   field: KeysOfType<NotificationConfiguration, TimeOption[]>;
   setStateHandler: (rowIndex: number, value: any) => void;
 };
 
-const SelectCell: React.FC<SelectCellProps> = props => {
+const SelectCell: React.FC<Props> = props => {
   const [selectedOption, setSelectedOption] = React.useState<TimeOption>();
   const timeOptions: TimeOption[] = props.data[props.field];
   timeOptions.sort((to1, to2) => to1.minutes - to2.minutes);
diff --git a/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/TimeOptionCell.tsx b/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/TimeOptionCell.tsx
index ff556790e3..73a5747b47 100644
--- a/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/TimeOptionCell.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/notificationConfigPanel/TimeOptionCell.tsx
@@ -4,9 +4,7 @@ import React, { useState } from 'react';
 import { NotificationConfiguration, TimeOption } from 'src/commons/application/types/SessionTypes';
 import { KeysOfType } from 'src/commons/utils/TypeHelper';
 
-type TimeOptionCellProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   data: NotificationConfiguration;
   rowIndex: number;
   field: KeysOfType<NotificationConfiguration, TimeOption[]>;
@@ -14,7 +12,7 @@ type OwnProps = {
   setDelete: (timeOption: TimeOption) => void;
 };
 
-const TimeOptionCell: React.FC<TimeOptionCellProps> = props => {
+const TimeOptionCell: React.FC<Props> = props => {
   const timeOptions: TimeOption[] = props.data[props.field];
   const [values, setValues] = useState<React.ReactNode[]>(
     timeOptions.map((timeOption: TimeOption) => (timeOption.minutes / 60).toFixed(2).toString())
diff --git a/src/pages/academy/adminPanel/subcomponents/userConfigPanel/RolesCell.tsx b/src/pages/academy/adminPanel/subcomponents/userConfigPanel/RolesCell.tsx
index 955cbe04c8..04bcfb9f8a 100644
--- a/src/pages/academy/adminPanel/subcomponents/userConfigPanel/RolesCell.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/userConfigPanel/RolesCell.tsx
@@ -4,16 +4,14 @@ import React from 'react';
 import { Role } from 'src/commons/application/ApplicationTypes';
 import { AdminPanelCourseRegistration } from 'src/commons/application/types/SessionTypes';
 
-type RolesCellProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   data: AdminPanelCourseRegistration;
   rowIndex: number;
   courseRegId: number;
   handleUpdateUserRole: (courseRegId: number, role: Role) => void;
 };
 
-const RolesCell: React.FC<RolesCellProps> = props => {
+const RolesCell: React.FC<Props> = props => {
   const { data } = props;
 
   const changeHandler = React.useCallback(
@@ -24,18 +22,9 @@ const RolesCell: React.FC<RolesCellProps> = props => {
   );
 
   const roleOptions = [
-    {
-      label: 'Student',
-      value: Role.Student
-    },
-    {
-      label: 'Staff',
-      value: Role.Staff
-    },
-    {
-      label: 'Admin',
-      value: Role.Admin
-    }
+    { label: 'Student', value: Role.Student },
+    { label: 'Staff', value: Role.Staff },
+    { label: 'Admin', value: Role.Admin }
   ];
   return (
     <Popover2
diff --git a/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserActionsCell.tsx b/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserActionsCell.tsx
index e570b87490..8bdf21018a 100644
--- a/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserActionsCell.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserActionsCell.tsx
@@ -14,7 +14,7 @@ type Props = {
 };
 
 const DeleteUserCell: React.FC<Props> = ({ data, handleDeleteUserFromCourse }) => {
-  const [isDialogOpen, setIsDialogOpen] = useState<boolean>(false);
+  const [isDialogOpen, setIsDialogOpen] = useState(false);
 
   const clickHandler = () => {
     if (data.role === Role.Admin) {
diff --git a/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserConfigPanel.tsx b/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserConfigPanel.tsx
index 8d88ade90d..f0a65b5bfb 100644
--- a/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserConfigPanel.tsx
+++ b/src/pages/academy/adminPanel/subcomponents/userConfigPanel/UserConfigPanel.tsx
@@ -8,9 +8,7 @@ import { AdminPanelCourseRegistration } from 'src/commons/application/types/Sess
 import RolesCell from './RolesCell';
 import UserActionsCell from './UserActionsCell';
 
-export type UserConfigPanelProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   courseRegId?: number;
   userCourseRegistrations?: AdminPanelCourseRegistration[];
   handleUpdateUserRole: (courseRegId: number, role: Role) => void;
@@ -24,14 +22,14 @@ type OwnProps = {
  *   other admins can do so, to prevent a scenario where there are
  *   no admins left in a course)
  */
-const UserConfigPanel: React.FC<UserConfigPanelProps> = props => {
+const UserConfigPanel: React.FC<Props> = props => {
   const gridApi = React.useRef<GridApi>();
 
   const userCourseRegistrations = props.userCourseRegistrations?.map(e =>
     !e.name ? { ...e, name: '(user has yet to log in)' } : e
   );
 
-  const columnDefs: ColDef[] = [
+  const columnDefs: ColDef<AdminPanelCourseRegistration>[] = [
     {
       headerName: 'Name',
       field: 'name',
@@ -57,7 +55,7 @@ const UserConfigPanel: React.FC<UserConfigPanelProps> = props => {
     },
     {
       headerName: 'Actions',
-      field: 'actions',
+      field: 'actions' as any,
       cellRenderer: UserActionsCell,
       cellRendererParams: {
         handleDeleteUserFromCourse: props.handleDeleteUserFromCourse
diff --git a/src/pages/academy/dashboard/Dashboard.tsx b/src/pages/academy/dashboard/Dashboard.tsx
index 89915e8311..c3c0dacbf6 100644
--- a/src/pages/academy/dashboard/Dashboard.tsx
+++ b/src/pages/academy/dashboard/Dashboard.tsx
@@ -11,17 +11,13 @@ import { useTypedSelector } from 'src/commons/utils/Hooks';
 import ContentDisplay from '../../../commons/ContentDisplay';
 import { fetchGroupGradingSummary } from '../../../features/dashboard/DashboardActions';
 
-type DashboardProps = StateProps;
-
-export type StateProps = {};
-
 const defaultColumnDefs: ColDef = {
   filter: true,
   resizable: true,
   sortable: true
 };
 
-const Dashboard: React.FC<DashboardProps> = props => {
+const Dashboard: React.FC = () => {
   const dispatch = useDispatch();
   const gradingSummary = useTypedSelector(state => state.dashboard.gradingSummary);
 
diff --git a/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewerUpload.tsx b/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewerUpload.tsx
index d817775966..1c48472724 100644
--- a/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewerUpload.tsx
+++ b/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewerUpload.tsx
@@ -10,7 +10,7 @@ const AssetViewerUpload: React.FC = () => {
   const [uploadFolder, setUploadFolder] = useState<string>(s3AssetFolders[0]);
 
   const [folderOverwrite, setFolderOverwrite] = useState<string>();
-  const [showfolderOverwrite, setShowFolderOverwrite] = useState<boolean>(false);
+  const [showfolderOverwrite, setShowFolderOverwrite] = useState(false);
 
   function handleLoadFile(e: any) {
     if (!e.target.files) return;
diff --git a/src/pages/academy/grading/subcomponents/GradingActions.tsx b/src/pages/academy/grading/subcomponents/GradingActions.tsx
index 93e2400494..d10ea8f5dc 100644
--- a/src/pages/academy/grading/subcomponents/GradingActions.tsx
+++ b/src/pages/academy/grading/subcomponents/GradingActions.tsx
@@ -10,11 +10,11 @@ import {
 import { showSimpleConfirmDialog } from 'src/commons/utils/DialogHelper';
 import { useTypedSelector } from 'src/commons/utils/Hooks';
 
-type GradingActionsProps = {
+type Props = {
   submissionId: number;
 };
 
-const GradingActions: React.FC<GradingActionsProps> = ({ submissionId }) => {
+const GradingActions: React.FC<Props> = ({ submissionId }) => {
   const dispatch = useDispatch();
   const courseId = useTypedSelector(store => store.session.courseId);
 
diff --git a/src/pages/academy/grading/subcomponents/GradingSubmissionFilters.tsx b/src/pages/academy/grading/subcomponents/GradingSubmissionFilters.tsx
index 8f1091ff06..19a5ca8f35 100644
--- a/src/pages/academy/grading/subcomponents/GradingSubmissionFilters.tsx
+++ b/src/pages/academy/grading/subcomponents/GradingSubmissionFilters.tsx
@@ -3,15 +3,12 @@ import { Flex } from '@tremor/react';
 
 import { FilterBadge } from './GradingBadges';
 
-type GradingSubmissionFiltersProps = {
+type Props = {
   filters: ColumnFiltersState;
   onFilterRemove: (filter: ColumnFilter) => void;
 };
 
-const GradingSubmissionFilters: React.FC<GradingSubmissionFiltersProps> = ({
-  filters,
-  onFilterRemove
-}) => {
+const GradingSubmissionFilters: React.FC<Props> = ({ filters, onFilterRemove }) => {
   return (
     <Flex justifyContent="justify-start" spaceX="space-x-1">
       {filters.map(filter => (
diff --git a/src/pages/academy/grading/subcomponents/GradingSubmissionsTable.tsx b/src/pages/academy/grading/subcomponents/GradingSubmissionsTable.tsx
index 353d414758..21f8aef388 100644
--- a/src/pages/academy/grading/subcomponents/GradingSubmissionsTable.tsx
+++ b/src/pages/academy/grading/subcomponents/GradingSubmissionsTable.tsx
@@ -104,14 +104,14 @@ const makeColumns = (handleClick: () => void) => [
   })
 ];
 
-type GradingSubmissionTableProps = {
+type Props = {
   totalRows: number;
   pageSize: number;
   submissions: GradingOverview[];
   updateEntries: (page: number, filterParams: Object) => void;
 };
 
-const GradingSubmissionTable: React.FC<GradingSubmissionTableProps> = ({
+const GradingSubmissionTable: React.FC<Props> = ({
   totalRows,
   pageSize,
   submissions,
diff --git a/src/pages/academy/grading/subcomponents/GradingWorkspace.tsx b/src/pages/academy/grading/subcomponents/GradingWorkspace.tsx
index c602ab26b2..64c9de8be6 100644
--- a/src/pages/academy/grading/subcomponents/GradingWorkspace.tsx
+++ b/src/pages/academy/grading/subcomponents/GradingWorkspace.tsx
@@ -60,11 +60,6 @@ import { WorkspaceLocation, WorkspaceState } from '../../../../commons/workspace
 import { AnsweredQuestion } from '../../../../features/grading/GradingTypes';
 import GradingEditor from './GradingEditor';
 
-type GradingWorkspaceProps = {
-  submissionId: number;
-  questionId: number;
-};
-
 const workspaceLocation: WorkspaceLocation = 'grading';
 const unansweredPrependValue: string = `// This answer does not have significant changes from the given solution
 // template and has thus been flagged as unanswered.
@@ -73,7 +68,12 @@ const unansweredPrependValue: string = `// This answer does not have significant
 
 `;
 
-const GradingWorkspace: React.FC<GradingWorkspaceProps> = props => {
+type Props = {
+  submissionId: number;
+  questionId: number;
+};
+
+const GradingWorkspace: React.FC<Props> = props => {
   const navigate = useNavigate();
   const { selectedTab, setSelectedTab } = useSideContent(
     workspaceLocation,
@@ -228,7 +228,7 @@ const GradingWorkspace: React.FC<GradingWorkspaceProps> = props => {
    *
    * Assumes that 'grading' is defined
    */
-  const checkWorkspaceReset = (props: GradingWorkspaceProps) => {
+  const checkWorkspaceReset = (props: Props) => {
     /* Reset grading if it has changed.*/
     const submissionId = props.submissionId;
     const questionId = props.questionId;
@@ -290,8 +290,8 @@ const GradingWorkspace: React.FC<GradingWorkspaceProps> = props => {
   };
 
   /** Pre-condition: Grading has been loaded */
-  const sideContentProps: (p: GradingWorkspaceProps, q: number) => SideContentProps = (
-    props: GradingWorkspaceProps,
+  const sideContentProps: (p: Props, q: number) => SideContentProps = (
+    props: Props,
     questionId: number
   ) => {
     const tabs: SideContentTab[] = [
diff --git a/src/pages/academy/groundControl/subcomponents/GroundControlDropzone.tsx b/src/pages/academy/groundControl/subcomponents/GroundControlDropzone.tsx
index 6bcd3bf24c..6bf165e4c3 100644
--- a/src/pages/academy/groundControl/subcomponents/GroundControlDropzone.tsx
+++ b/src/pages/academy/groundControl/subcomponents/GroundControlDropzone.tsx
@@ -18,11 +18,11 @@ type StateProps = {
   assessmentConfigurations?: AssessmentConfiguration[];
 };
 
-const MaterialDropzone: React.FunctionComponent<DropzoneProps> = props => {
+const MaterialDropzone: React.FC<DropzoneProps> = props => {
   const [file, setFile] = React.useState<File | undefined>(undefined);
-  const [isWarningShown, setPromptShown] = React.useState<boolean>(false);
-  const [forceUpdate, setForceUpdate] = React.useState<boolean>(false);
-  const [assessmentConfigId, setAssessmentConfigId] = React.useState<number>(-1);
+  const [isWarningShown, setPromptShown] = React.useState(false);
+  const [forceUpdate, setForceUpdate] = React.useState(false);
+  const [assessmentConfigId, setAssessmentConfigId] = React.useState(-1);
 
   React.useEffect(() => {
     if (props.assessmentConfigurations && assessmentConfigId === -1) {
diff --git a/src/pages/academy/groundControl/subcomponents/GroundControlEditCell.tsx b/src/pages/academy/groundControl/subcomponents/GroundControlEditCell.tsx
index d8487fb15c..19cb9f68d9 100644
--- a/src/pages/academy/groundControl/subcomponents/GroundControlEditCell.tsx
+++ b/src/pages/academy/groundControl/subcomponents/GroundControlEditCell.tsx
@@ -1,7 +1,7 @@
 import { Dialog, DialogBody, DialogFooter, Intent } from '@blueprintjs/core';
 import { DateInput3 } from '@blueprintjs/datetime2';
 import { IconNames } from '@blueprintjs/icons';
-import * as moment from 'moment';
+import moment from 'moment';
 import React, { useCallback, useState } from 'react';
 
 import { AssessmentOverview } from '../../../../commons/assessment/AssessmentTypes';
diff --git a/src/pages/academy/notiPreference/NotiPreference.tsx b/src/pages/academy/notiPreference/NotiPreference.tsx
index bc32b2981a..2476be1eb1 100644
--- a/src/pages/academy/notiPreference/NotiPreference.tsx
+++ b/src/pages/academy/notiPreference/NotiPreference.tsx
@@ -25,7 +25,7 @@ const NotiPreference: React.FC = () => {
   const dispatch = useDispatch();
   const session = useTypedSelector(state => state.session);
 
-  const [hasChanges, setHasChanges] = useState<boolean>(false);
+  const [hasChanges, setHasChanges] = useState(false);
 
   const configurableNotificationConfigs = React.useRef<NotificationConfiguration[] | undefined>(
     session.configurableNotificationConfigs
@@ -87,7 +87,7 @@ const NotiPreference: React.FC = () => {
     return params.data!.notificationType.forStaff ? 'Staff' : 'Student';
   };
 
-  const columnDefs: ColDef[] = [
+  const columnDefs: ColDef<NotificationConfiguration>[] = [
     {
       headerName: 'Notification Type',
       field: 'notificationType.name',
@@ -177,7 +177,7 @@ const NotiPreference: React.FC = () => {
     </div>
   );
 
-  return <ContentDisplay loadContentDispatch={() => {}} display={data} fullWidth={false} />;
+  return <ContentDisplay display={data} fullWidth={false} />;
 };
 
 export default NotiPreference;
diff --git a/src/pages/academy/notiPreference/subcomponents/BooleanCell.tsx b/src/pages/academy/notiPreference/subcomponents/BooleanCell.tsx
index 6f450b5fd5..c767d2a4b8 100644
--- a/src/pages/academy/notiPreference/subcomponents/BooleanCell.tsx
+++ b/src/pages/academy/notiPreference/subcomponents/BooleanCell.tsx
@@ -3,16 +3,14 @@ import React from 'react';
 import { NotificationConfiguration } from 'src/commons/application/types/SessionTypes';
 import { KeysOfType } from 'src/commons/utils/TypeHelper';
 
-type BooleanCellProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   data: NotificationConfiguration;
   field: KeysOfType<NotificationConfiguration, boolean>;
   rowIndex: number;
   setStateHandler: (index: number, value: boolean) => void;
 };
 
-const BooleanCell: React.FC<BooleanCellProps> = props => {
+const BooleanCell: React.FC<Props> = props => {
   const { data } = props;
   let checked = false;
 
diff --git a/src/pages/academy/notiPreference/subcomponents/SelectCell.tsx b/src/pages/academy/notiPreference/subcomponents/SelectCell.tsx
index 09467327d4..c883494cb2 100644
--- a/src/pages/academy/notiPreference/subcomponents/SelectCell.tsx
+++ b/src/pages/academy/notiPreference/subcomponents/SelectCell.tsx
@@ -4,16 +4,14 @@ import React from 'react';
 import { NotificationConfiguration, TimeOption } from 'src/commons/application/types/SessionTypes';
 import { KeysOfType } from 'src/commons/utils/TypeHelper';
 
-type SelectCellProps = OwnProps;
-
-type OwnProps = {
+type Props = {
   data: NotificationConfiguration;
   rowIndex: number;
   field: KeysOfType<NotificationConfiguration, TimeOption[]>;
   setStateHandler: (rowIndex: number, value: TimeOption) => void;
 };
 
-const SelectCell: React.FC<SelectCellProps> = props => {
+const SelectCell: React.FC<Props> = props => {
   const [selectedOption, setSelectedOption] = React.useState<TimeOption>();
   const timeOptions: TimeOption[] = props.data[props.field];
   timeOptions.sort((to1, to2) => to1.minutes - to2.minutes);
diff --git a/src/pages/achievement/control/AchievementControl.tsx b/src/pages/achievement/control/AchievementControl.tsx
index c83b00162b..3eced74263 100644
--- a/src/pages/achievement/control/AchievementControl.tsx
+++ b/src/pages/achievement/control/AchievementControl.tsx
@@ -55,7 +55,7 @@ const AchievementControl: React.FC = () => {
   /**
    * Monitors changes that are awaiting publish
    */
-  const [awaitPublish, setAwaitPublish] = useState<boolean>(false);
+  const [awaitPublish, setAwaitPublish] = useState(false);
   const publishChanges = () => {
     // NOTE: Goals and achievements must exist in the backend before the association can be built
     handleBulkUpdateGoals(inferencer.getAllGoals());
diff --git a/src/pages/achievement/subcomponents/AchievementDashboard.tsx b/src/pages/achievement/subcomponents/AchievementDashboard.tsx
index 688ad717ae..736bf20d4d 100644
--- a/src/pages/achievement/subcomponents/AchievementDashboard.tsx
+++ b/src/pages/achievement/subcomponents/AchievementDashboard.tsx
@@ -128,10 +128,10 @@ const AchievementDashboard: React.FC = () => {
    * Marks the achievement uuid that is currently on focus (selected)
    * If an achievement is focused, the cards glow and dashboard displays the AchievementView
    */
-  const focusState = useState<string>('');
+  const focusState = useState('');
   const [focusUuid, setFocusUuid] = focusState;
 
-  const hiddenState = useState<boolean>(false);
+  const hiddenState = useState(false);
   const [seeHidden] = hiddenState;
 
   // Resets AchievementView when the selected user changes
diff --git a/src/pages/missionControl/MissionControl.tsx b/src/pages/missionControl/MissionControl.tsx
index 40270bb2ab..fbabf29677 100644
--- a/src/pages/missionControl/MissionControl.tsx
+++ b/src/pages/missionControl/MissionControl.tsx
@@ -16,8 +16,6 @@ import Constants from '../../commons/utils/Constants';
 import { convertParamToInt } from '../../commons/utils/ParamParseHelper';
 import { retrieveLocalAssessmentOverview } from '../../commons/XMLParser/XMLParserHelper';
 
-const nullFunction = () => {};
-
 const MissionControl: React.FC = () => {
   const { assessmentConfigurations } = useSession();
   const assessmentTypes = assessmentConfigurations?.map(e => e.type) || [];
@@ -75,7 +73,7 @@ const MissionControl: React.FC = () => {
   // Finally, render the ContentDisplay.
   return (
     <div className={classNames('Assessment', academyClasses['Academy'])}>
-      <ContentDisplay display={display} loadContentDispatch={nullFunction} />
+      <ContentDisplay display={display} />
     </div>
   );
 };
diff --git a/src/pages/playground/__tests__/__snapshots__/Playground.tsx.snap b/src/pages/playground/__tests__/__snapshots__/Playground.tsx.snap
index 36c28d3d4e..3461593585 100644
--- a/src/pages/playground/__tests__/__snapshots__/Playground.tsx.snap
+++ b/src/pages/playground/__tests__/__snapshots__/Playground.tsx.snap
@@ -298,7 +298,7 @@ exports[`Playground tests Playground renders correctly 1`] = `
               class="editor-container"
             >
               <div
-                class="Editor bp4-card bp4-elevation-0"
+                class="Editor bp5-card bp5-elevation-0"
                 tabindex="-1"
               >
                 <div
@@ -1661,7 +1661,7 @@ exports[`Playground tests Playground with link renders correctly 1`] = `
               class="editor-container"
             >
               <div
-                class="Editor bp4-card bp4-elevation-0"
+                class="Editor bp5-card bp5-elevation-0"
                 tabindex="-1"
               >
                 <div
diff --git a/src/pages/sicp/subcomponents/SicpExercise.tsx b/src/pages/sicp/subcomponents/SicpExercise.tsx
index 33ab83c5a3..885a9aac8b 100644
--- a/src/pages/sicp/subcomponents/SicpExercise.tsx
+++ b/src/pages/sicp/subcomponents/SicpExercise.tsx
@@ -1,13 +1,6 @@
 import { Button, Card, Collapse, Elevation } from '@blueprintjs/core';
 import React from 'react';
 
-type SicpExerciseProps = OwnProps;
-type OwnProps = {
-  title: string;
-  body: JSX.Element;
-  solution: JSX.Element | undefined;
-};
-
 export const noSolutionPlaceholder = (
   <span>
     There is currently no solution available for this exercise. This textbook adaptation is a
@@ -20,7 +13,13 @@ export const noSolutionPlaceholder = (
   </span>
 );
 
-const SicpExercise: React.FC<SicpExerciseProps> = props => {
+type Props = {
+  title: string;
+  body: JSX.Element;
+  solution: JSX.Element | undefined;
+};
+
+const SicpExercise: React.FC<Props> = props => {
   const [isOpen, setIsOpen] = React.useState(false);
 
   const onClick = () => {
diff --git a/src/pages/sicp/subcomponents/SicpLatex.tsx b/src/pages/sicp/subcomponents/SicpLatex.tsx
index 68555c2b07..b8dc76544b 100644
--- a/src/pages/sicp/subcomponents/SicpLatex.tsx
+++ b/src/pages/sicp/subcomponents/SicpLatex.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 import Latex from 'react-latex-next';
 
-type SicpLatexProps = {
+type Props = {
   math: string;
 };
 
-const SicpLatex: React.FC<SicpLatexProps> = props => {
-  return <Latex>{props.math}</Latex>;
+const SicpLatex: React.FC<Props> = ({ math }) => {
+  return <Latex>{math}</Latex>;
 };
 
 export default SicpLatex;
diff --git a/src/pages/sicp/subcomponents/__tests__/__snapshots__/SicpLatex.tsx.snap b/src/pages/sicp/subcomponents/__tests__/__snapshots__/SicpLatex.tsx.snap
index 259e895d84..444b406753 100644
--- a/src/pages/sicp/subcomponents/__tests__/__snapshots__/SicpLatex.tsx.snap
+++ b/src/pages/sicp/subcomponents/__tests__/__snapshots__/SicpLatex.tsx.snap
@@ -1,65 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Sicp latex renders correctly block 1`] = `
-<Latex
-  delimiters={
-    Array [
-      Object {
-        "display": true,
-        "left": "$$",
-        "right": "$$",
-      },
-      Object {
-        "display": false,
-        "left": "\\\\(",
-        "right": "\\\\)",
-      },
-      Object {
-        "display": false,
-        "left": "$",
-        "right": "$",
-      },
-      Object {
-        "display": true,
-        "left": "\\\\[",
-        "right": "\\\\]",
-      },
-    ]
-  }
-  strict={false}
->
+<Latex$1>
   1+1
-</Latex>
+</Latex$1>
 `;
 
 exports[`Sicp latex renders correctly inline 1`] = `
-<Latex
-  delimiters={
-    Array [
-      Object {
-        "display": true,
-        "left": "$$",
-        "right": "$$",
-      },
-      Object {
-        "display": false,
-        "left": "\\\\(",
-        "right": "\\\\)",
-      },
-      Object {
-        "display": false,
-        "left": "$",
-        "right": "$",
-      },
-      Object {
-        "display": true,
-        "left": "\\\\[",
-        "right": "\\\\]",
-      },
-    ]
-  }
-  strict={false}
->
+<Latex$1>
   1+1
-</Latex>
+</Latex$1>
 `;
diff --git a/src/pages/sicp/subcomponents/chatbot/ChatBox.tsx b/src/pages/sicp/subcomponents/chatbot/ChatBox.tsx
index e652bb6f2c..c55337142b 100644
--- a/src/pages/sicp/subcomponents/chatbot/ChatBox.tsx
+++ b/src/pages/sicp/subcomponents/chatbot/ChatBox.tsx
@@ -8,18 +8,18 @@ import classes from 'src/styles/Chatbot.module.scss';
 import { chat } from '../../../../commons/sagas/RequestsSaga';
 import SICPNotes from './SicpNotes';
 
-interface ChatBoxProps {
+type Props = {
   getSection: () => string;
   getText: () => string;
-}
+};
 
-const ChatBox: React.FC<ChatBoxProps> = ({ getSection, getText }) => {
+const ChatBox: React.FC<Props> = ({ getSection, getText }) => {
   const chatRef = React.useRef<HTMLDivElement | null>(null);
   const [isLoading, setIsLoading] = React.useState(false);
   const [messages, setMessages] = React.useState<{ role: 'user' | 'bot'; content: string[] }[]>([
     { content: ['Ask me something about this paragraph!'], role: 'bot' }
   ]);
-  const [userInput, setUserInput] = React.useState<string>('');
+  const [userInput, setUserInput] = React.useState('');
   const [contentHistory, setContentHistory] = React.useState<Array<string>>([]);
   const [roleHistory, setRoleHistory] = React.useState<Array<string>>([]);
   const { accessToken, refreshToken } = useSession();
diff --git a/src/pages/sicp/subcomponents/chatbot/Chatbot.tsx b/src/pages/sicp/subcomponents/chatbot/Chatbot.tsx
index fbfeb6863b..d2f5a1fc22 100644
--- a/src/pages/sicp/subcomponents/chatbot/Chatbot.tsx
+++ b/src/pages/sicp/subcomponents/chatbot/Chatbot.tsx
@@ -6,12 +6,12 @@ import classes from 'src/styles/Chatbot.module.scss';
 
 import ChatBox from './ChatBox';
 
-interface ChatbotProps {
+type Props = {
   getSection: () => string;
   getText: () => string;
-}
+};
 
-const Chatbot: React.FC<ChatbotProps> = ({ getSection, getText }) => {
+const Chatbot: React.FC<Props> = ({ getSection, getText }) => {
   const [isPop, setPop] = React.useState(false);
   const [isDivVisible, setIsDivVisible] = React.useState(false);
   const [tipsMessage, setTipsMessage] = React.useState('You can click me for a chat');
diff --git a/yarn.lock b/yarn.lock
index ab469560b6..ff340bba46 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2010,10 +2010,10 @@
     redux-thunk "^2.4.2"
     reselect "^4.1.8"
 
-"@remix-run/router@1.15.0":
-  version "1.15.0"
-  resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.15.0.tgz#461a952c2872dd82c8b2e9b74c4dfaff569123e2"
-  integrity sha512-HOil5aFtme37dVQTB6M34G95kPM3MMuqSmIRVCC52eKV+Y/tGSqw9P3rWhlAx6A+mz+MoX+XxsGsNJbaI5qCgQ==
+"@remix-run/router@1.15.3":
+  version "1.15.3"
+  resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.15.3.tgz#d2509048d69dbb72d5389a14945339f1430b2d3c"
+  integrity sha512-Oy8rmScVrVxWZVOpEF57ovlnhpZ8CCPlnIIumVcV9nFdiSIrus99+Lw78ekXyGvVDlIsFJbSfmSovJUhCWYV3w==
 
 "@rollup/plugin-babel@^5.2.0":
   version "5.3.1"
@@ -2057,76 +2057,76 @@
   resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.2.0.tgz#8be36a1f66f3265389e90b5f9c9962146758f728"
   integrity sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==
 
-"@sentry-internal/feedback@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry-internal/feedback/-/feedback-7.99.0.tgz#c3fec1500cb24c9a5e09479d478fddca909477da"
-  integrity sha512-exIO1o+bE0MW4z30FxC0cYzJ4ZHSMlDPMHCBDPzU+MWGQc/fb8s58QUrx5Dnm6HTh9G3H+YlroCxIo9u0GSwGQ==
+"@sentry-internal/feedback@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/feedback/-/feedback-7.107.0.tgz#144cf01b1c1739d61db3990519f59b49a356fef1"
+  integrity sha512-okF0B9AJHrpkwNMxNs/Lffw3N5ZNbGwz4uvCfyOfnMxc7E2VfDM18QzUvTBRvNr3bA9wl+InJ+EMG3aZhyPunA==
   dependencies:
-    "@sentry/core" "7.99.0"
-    "@sentry/types" "7.99.0"
-    "@sentry/utils" "7.99.0"
+    "@sentry/core" "7.107.0"
+    "@sentry/types" "7.107.0"
+    "@sentry/utils" "7.107.0"
 
-"@sentry-internal/replay-canvas@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry-internal/replay-canvas/-/replay-canvas-7.99.0.tgz#d6ba7eec7ab2f7210a7deb6daa4dd82f7b1e9e29"
-  integrity sha512-PoIkfusToDq0snfl2M6HJx/1KJYtXxYhQplrn11kYadO04SdG0XGXf4h7wBTMEQ7LDEAtQyvsOu4nEQtTO3YjQ==
+"@sentry-internal/replay-canvas@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/replay-canvas/-/replay-canvas-7.107.0.tgz#ce2a8f6bf63ab962e696f26b509cfb87aa931302"
+  integrity sha512-dmDL9g3QDfo7axBOsVnpiKdJ/DXrdeuRv1AqsLgwzJKvItsv0ZizX0u+rj5b1UoxcwbXRMxJ0hit5a1yt3t/ow==
   dependencies:
-    "@sentry/core" "7.99.0"
-    "@sentry/replay" "7.99.0"
-    "@sentry/types" "7.99.0"
-    "@sentry/utils" "7.99.0"
+    "@sentry/core" "7.107.0"
+    "@sentry/replay" "7.107.0"
+    "@sentry/types" "7.107.0"
+    "@sentry/utils" "7.107.0"
 
-"@sentry-internal/tracing@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry-internal/tracing/-/tracing-7.99.0.tgz#ad13f8343444ecf7323a4220d4e57a55166565d7"
-  integrity sha512-z3JQhHjoM1KdM20qrHwRClKJrNLr2CcKtCluq7xevLtXHJWNAQQbafnWD+Aoj85EWXBzKt9yJMv2ltcXJ+at+w==
+"@sentry-internal/tracing@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/tracing/-/tracing-7.107.0.tgz#a10b4abcbc9e0d8da948e3a95029574387ca7b16"
+  integrity sha512-le9wM8+OHBbq7m/8P7JUJ1UhSPIty+Z/HmRXc5Z64ODZcOwFV6TmDpYx729IXDdz36XUKmeI+BeM7yQdTTZPfQ==
   dependencies:
-    "@sentry/core" "7.99.0"
-    "@sentry/types" "7.99.0"
-    "@sentry/utils" "7.99.0"
+    "@sentry/core" "7.107.0"
+    "@sentry/types" "7.107.0"
+    "@sentry/utils" "7.107.0"
 
 "@sentry/browser@^7.57.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.99.0.tgz#3e78beb490d141c988038ea902689a1e9171c6cf"
-  integrity sha512-bgfoUv3wkwwLgN5YUOe0ibB3y268ZCnamZh6nLFqnY/UBKC1+FXWFdvzVON/XKUm62LF8wlpCybOf08ebNj2yg==
-  dependencies:
-    "@sentry-internal/feedback" "7.99.0"
-    "@sentry-internal/replay-canvas" "7.99.0"
-    "@sentry-internal/tracing" "7.99.0"
-    "@sentry/core" "7.99.0"
-    "@sentry/replay" "7.99.0"
-    "@sentry/types" "7.99.0"
-    "@sentry/utils" "7.99.0"
-
-"@sentry/core@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.99.0.tgz#6881aae5ac1436637b3d88e0b12df4ab56016c5f"
-  integrity sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==
-  dependencies:
-    "@sentry/types" "7.99.0"
-    "@sentry/utils" "7.99.0"
-
-"@sentry/replay@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.99.0.tgz#c63f2bd79a791538ba54bcd91f02379dc4d5c1cc"
-  integrity sha512-gyN/I2WpQrLAZDT+rScB/0jnFL2knEVBo8U8/OVt8gNP20Pq8T/rDZKO/TG0cBfvULDUbJj2P4CJryn2p/O2rA==
-  dependencies:
-    "@sentry-internal/tracing" "7.99.0"
-    "@sentry/core" "7.99.0"
-    "@sentry/types" "7.99.0"
-    "@sentry/utils" "7.99.0"
-
-"@sentry/types@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.99.0.tgz#bba7a514abab445026ee42f40f92f81275a6deba"
-  integrity sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==
-
-"@sentry/utils@7.99.0":
-  version "7.99.0"
-  resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.99.0.tgz#ef96c3b59e23c79f3ef500db508234a48fa1cfbe"
-  integrity sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==
-  dependencies:
-    "@sentry/types" "7.99.0"
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.107.0.tgz#a1caf4a3c39857862ba3314b9d4ed03f9259f338"
+  integrity sha512-KnqaQDhxv6w9dJ+mYLsNwPeGZfgbpM3vaismBNyJCKLgWn2V75kxkSq+bDX8LQT/13AyK7iFp317L6P8EuNa3g==
+  dependencies:
+    "@sentry-internal/feedback" "7.107.0"
+    "@sentry-internal/replay-canvas" "7.107.0"
+    "@sentry-internal/tracing" "7.107.0"
+    "@sentry/core" "7.107.0"
+    "@sentry/replay" "7.107.0"
+    "@sentry/types" "7.107.0"
+    "@sentry/utils" "7.107.0"
+
+"@sentry/core@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.107.0.tgz#926838ba2c2861d6bd2bced0232e1f9d1ead6c75"
+  integrity sha512-C7ogye6+KPyBi8NVL0P8Rxx3Ur7Td8ufnjxosVy678lqY+dcYPk/HONROrzUFYW5fMKWL4/KYnwP+x9uHnkDmw==
+  dependencies:
+    "@sentry/types" "7.107.0"
+    "@sentry/utils" "7.107.0"
+
+"@sentry/replay@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.107.0.tgz#d714f864ef8602e6d009b2fa8ff8e4ef63c3e9e4"
+  integrity sha512-BNJDEVaEwr/YnV22qnyVA1almx/3p615m3+KaF8lPo7YleYgJGSJv1auH64j1G8INkrJ0J0wFBujb1EFjMYkxA==
+  dependencies:
+    "@sentry-internal/tracing" "7.107.0"
+    "@sentry/core" "7.107.0"
+    "@sentry/types" "7.107.0"
+    "@sentry/utils" "7.107.0"
+
+"@sentry/types@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.107.0.tgz#5ba4b472be6ccad9aecd58dbc0141a09dafb68c1"
+  integrity sha512-H7qcPjPSUWHE/Zf5bR1EE24G0pGVuJgrSx8Tvvl5nKEepswMYlbXHRVSDN0gTk/E5Z7cqf+hUBOpkQgZyps77w==
+
+"@sentry/utils@7.107.0":
+  version "7.107.0"
+  resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.107.0.tgz#b8524539d052a40f9c5f34a8347501f0f81a0751"
+  integrity sha512-C6PbN5gHh73MRHohnReeQ60N8rrLYa9LciHue3Ru2290eSThg4CzsPnx4SzkGpkSeVlhhptKtKZ+hp/ha3iVuw==
+  dependencies:
+    "@sentry/types" "7.107.0"
 
 "@sinclair/typebox@^0.24.1":
   version "0.24.51"
@@ -2398,16 +2398,16 @@
     react-transition-state "^2.1.0"
 
 "@tanstack/react-table@^8.9.3":
-  version "8.11.8"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-table/-/react-table-8.11.8.tgz#4eef4a2d91116ca51c8c9b2f00b455d8d99886c7"
-  integrity sha512-NEwvIq4iSiDQozEyvbdiSdCOiLa+g5xHmdEnvwDb98FObcK6YkBOkRrs/CNqrKdDy+/lqoIllIWHk+M80GW6+g==
+  version "8.12.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/react-table/-/react-table-8.12.0.tgz#069210657f9f6c6c17584cc955a8ebb25b8642f8"
+  integrity sha512-LlEQ1Gpz4bfpiET+qmle4BhKDgKN3Y/sssc+O/wLqX8HRtjV+nhusYbllZlutZfMR8oeef83whKTj/VhaV8EeA==
   dependencies:
-    "@tanstack/table-core" "8.11.8"
+    "@tanstack/table-core" "8.12.0"
 
-"@tanstack/table-core@8.11.8":
-  version "8.11.8"
-  resolved "https://registry.yarnpkg.com/@tanstack/table-core/-/table-core-8.11.8.tgz#7f46c31894249dbb57e43ad95c80e891236a895f"
-  integrity sha512-DECHvtq4YW4U/gqg6etup7ydt/RB1Bi1pJaMpHUXl65ooW1d71Nv7BzD66rUdHrBSNdyiW3PLTPUQlpXjAgDeA==
+"@tanstack/table-core@8.12.0":
+  version "8.12.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/table-core/-/table-core-8.12.0.tgz#ada34e17ca761fed99353b48e8cb7deacc971025"
+  integrity sha512-cq/ylWVrOwixmwNXQjgZaQw1Izf7+nPxjczum7paAnMtwPg1S2qRAJU+Jb8rEBUWm69voC/zcChmePlk2hc6ug==
 
 "@testing-library/dom@^9.0.0":
   version "9.3.1"
@@ -2833,9 +2833,9 @@
   integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
 
 "@types/lodash@^4.14.195":
-  version "4.14.202"
-  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.202.tgz#f09dbd2fb082d507178b2f2a5c7e74bd72ff98f8"
-  integrity sha512-OvlIYQK9tNneDlS0VN54LLd5uiPCBOp7gS5Z0f1mjoJYBrtStzgmJBxONW3U6OZqdtNzZPmn9BS/7WI7BFFcFQ==
+  version "4.17.0"
+  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.17.0.tgz#d774355e41f372d5350a4d0714abb48194a489c3"
+  integrity sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA==
 
 "@types/mdast@^4.0.0":
   version "4.0.3"
@@ -2906,9 +2906,9 @@
     "@types/react" "*"
 
 "@types/react-dom@^18.0.0", "@types/react-dom@^18.2.6":
-  version "18.2.18"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.2.18.tgz#16946e6cd43971256d874bc3d0a72074bb8571dd"
-  integrity sha512-TJxDm6OfAX2KJWJdMEVTwWke5Sc/E/RlnPGvGfS0W7+6ocy2xhDVQVh/KvC2Uf7kACs+gDytdusDSdWfWkaNzw==
+  version "18.2.22"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.2.22.tgz#d332febf0815403de6da8a97e5fe282cbe609bae"
+  integrity sha512-fHkBXPeNtfvri6gdsMYyW+dW7RXFo6Ad09nLFK0VQWR7yGLai/Cyvyj696gbwYvBnhGtevUG9cET0pmUbMtoPQ==
   dependencies:
     "@types/react" "*"
 
@@ -2975,9 +2975,9 @@
     react-textarea-autosize "*"
 
 "@types/react@*", "@types/react@^18.2.13":
-  version "18.2.52"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.52.tgz#83ca0c62bd1ff31464dac4cf1937e55c78f77aa2"
-  integrity sha512-E/YjWh3tH+qsLKaUzgpZb5AY0ChVa+ZJzF7ogehVILrFpdQk6nC/WXOv0bfFEABbXbgNxLBGU7IIZByPKb6eBw==
+  version "18.2.66"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.66.tgz#d2eafc8c4e70939c5432221adb23d32d76bfe451"
+  integrity sha512-OYTmMI4UigXeFMF/j4uv0lBBEbongSgptPrHBxqME44h9+yNov+oL6Z3ocJKo0WyXR84sQUNeyIp9MRfckvZpg==
   dependencies:
     "@types/prop-types" "*"
     "@types/scheduler" "*"
@@ -3447,17 +3447,17 @@ adjust-sourcemap-loader@^4.0.0:
     loader-utils "^2.0.0"
     regex-parser "^2.2.11"
 
-ag-grid-community@^31.0.0, ag-grid-community@~31.0.3:
-  version "31.0.3"
-  resolved "https://registry.yarnpkg.com/ag-grid-community/-/ag-grid-community-31.0.3.tgz#80870881a3be03aa5df890b4a70409ef5d781e7f"
-  integrity sha512-k81YmLaOQOab9BavYD+Pw2smZSl6TXOJqj9hRuf70XQl3EknOHCGcra7joJxZRJLMKE/HdR+u33TNyX4TCuWfg==
+ag-grid-community@31.1.1, ag-grid-community@^31.0.0:
+  version "31.1.1"
+  resolved "https://registry.yarnpkg.com/ag-grid-community/-/ag-grid-community-31.1.1.tgz#212fc3e358d4be1865bc4618f6d0d865faaed385"
+  integrity sha512-tiQZ7VQ07yJScTMIQpaYoUMPgiyXMwYDcwTxe4riRrcYGTg0e258XEihoPUZFejR60P1fYWMxdJaR2JUnyhGrg==
 
 ag-grid-react@^31.0.0:
-  version "31.0.3"
-  resolved "https://registry.yarnpkg.com/ag-grid-react/-/ag-grid-react-31.0.3.tgz#4f9634129f37bd59de34529d62dff158115ca225"
-  integrity sha512-CE4Z5Rdb0H3MFBhmge9854AyDvI4DoG7ZoUJRFB1p2pu5ANVe6tv7cwEI/ugHemEXRRP6s5uvW+ndv0Q6x1/+Q==
+  version "31.1.1"
+  resolved "https://registry.yarnpkg.com/ag-grid-react/-/ag-grid-react-31.1.1.tgz#196c078a89bf977e81d64e3948fa31e23dca46b2"
+  integrity sha512-aaDMSP8MGhoXL5M9c4UmhBClRlc3mEMMC0E0/1mhXU6bdiz0QxXT/xQtDe3DFC62VrtXVda9x20Lpj6p6Bfy8g==
   dependencies:
-    ag-grid-community "~31.0.3"
+    ag-grid-community "31.1.1"
     prop-types "^15.8.1"
 
 agent-base@6, agent-base@^6.0.2:
@@ -4141,9 +4141,9 @@ big.js@^5.2.2:
   integrity sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==
 
 binary-extensions@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
-  integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.3.0.tgz#f6e14a97858d327252200242d4ccfe522c445522"
+  integrity sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==
 
 bindings@^1.5.0:
   version "1.5.0"
@@ -4491,9 +4491,9 @@ check-types@^11.1.1:
   integrity sha512-HBiYvXvn9Z70Z88XKjz3AEKd4HJhBXsa3j7xFnITAzoS8+q6eIGi8qDB8FKPBAjtuxjI/zFpwuiCb8oDtKOYrA==
 
 "chokidar@>=3.0.0 <4.0.0", chokidar@^3.4.2, chokidar@^3.5.3:
-  version "3.5.3"
-  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd"
-  integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.6.0.tgz#197c6cc669ef2a8dc5e7b4d97ee4e092c3eb0d5b"
+  integrity sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==
   dependencies:
     anymatch "~3.1.2"
     braces "~3.0.2"
@@ -7238,9 +7238,9 @@ humanize-ms@^1.2.1:
     ms "^2.0.0"
 
 husky@^9.0.0:
-  version "9.0.10"
-  resolved "https://registry.yarnpkg.com/husky/-/husky-9.0.10.tgz#ddca8908deb5f244e9286865ebc80b54387672c2"
-  integrity sha512-TQGNknoiy6bURzIO77pPRu+XHi6zI7T93rX+QnJsoYFf3xdjKOur+IlfqzJGMHIK/wXrLg+GsvMs8Op7vI2jVA==
+  version "9.0.11"
+  resolved "https://registry.yarnpkg.com/husky/-/husky-9.0.11.tgz#fc91df4c756050de41b3e478b2158b87c1e79af9"
+  integrity sha512-AB6lFlbwwyIqMdHYhwPe+kjOC3Oc5P3nThEoW/AaO2BX3vJDjWPFxYLxokUZOo6RNX20He3AaT8sESs9NJcmEw==
 
 hyphenate-style-name@^1.0.0:
   version "1.0.4"
@@ -7288,16 +7288,11 @@ ignore@^5.2.0:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.4.tgz#a291c0c6178ff1b960befe47fcdec301674a6324"
   integrity sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==
 
-immer@^9.0.21:
+immer@^9.0.21, immer@^9.0.7:
   version "9.0.21"
   resolved "https://registry.yarnpkg.com/immer/-/immer-9.0.21.tgz#1e025ea31a40f24fb064f1fef23e931496330176"
   integrity sha512-bc4NBHqOqSfRW7POMkHd51LvClaeMXpm8dx0e8oE2GORbq5aRK7Bxl4FyzVLdGtLmvLKL7BTDBG5ACQm4HWjTA==
 
-immer@^9.0.7:
-  version "9.0.19"
-  resolved "https://registry.yarnpkg.com/immer/-/immer-9.0.19.tgz#67fb97310555690b5f9cd8380d38fc0aabb6b38b"
-  integrity sha512-eY+Y0qcsB4TZKwgQzLaE/lqYMlKhv5J9dyd2RhhtGhNo2njPXDqU9XPfcNfa3MIDsdtZt5KlkIsirlo4dHsWdQ==
-
 immutable@^4.0.0:
   version "4.3.5"
   resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.3.5.tgz#f8b436e66d59f99760dc577f5c99a4fd2a5cc5a0"
@@ -10884,9 +10879,9 @@ react-konva@^18.2.10:
     scheduler "^0.23.0"
 
 react-latex-next@^2.1.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/react-latex-next/-/react-latex-next-2.2.0.tgz#8f4839adfebe3ba70c05ef66f2b94112e564a4fa"
-  integrity sha512-tQqIuC+OQBgiEYQObDZeHugVy+gtiWdLnAb3hWbo4jlchLF8FR0tIAErtJz7t4VA2VO03rRr8LwSZVTGu0cCxg==
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/react-latex-next/-/react-latex-next-2.3.0.tgz#37c59416a4446f1dfcee05b7541569a394070043"
+  integrity sha512-R6Q3fML5JHr7x50C22TIulsBBBz5dHefCbx1+rUQjjDnfAq3c3MbjNj1RGH8pOMV6UgAkrJyNHLTU3wOuIedQg==
   dependencies:
     katex "^0.13.0"
 
@@ -10968,19 +10963,19 @@ react-responsive@^9.0.0-beta.10:
     shallow-equal "^1.2.1"
 
 react-router-dom@^6.14.1:
-  version "6.22.0"
-  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.22.0.tgz#177c8bd27146decbb991eafb5df159f7a9f70035"
-  integrity sha512-z2w+M4tH5wlcLmH3BMMOMdrtrJ9T3oJJNsAlBJbwk+8Syxd5WFJ7J5dxMEW0/GEXD1BBis4uXRrNIz3mORr0ag==
+  version "6.22.3"
+  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.22.3.tgz#9781415667fd1361a475146c5826d9f16752a691"
+  integrity sha512-7ZILI7HjcE+p31oQvwbokjk6OA/bnFxrhJ19n82Ex9Ph8fNAq+Hm/7KchpMGlTgWhUxRHMMCut+vEtNpWpowKw==
   dependencies:
-    "@remix-run/router" "1.15.0"
-    react-router "6.22.0"
+    "@remix-run/router" "1.15.3"
+    react-router "6.22.3"
 
-react-router@6.22.0:
-  version "6.22.0"
-  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.22.0.tgz#a22b44851a79dafc6b944cb418db3e80622b9be1"
-  integrity sha512-q2yemJeg6gw/YixRlRnVx6IRJWZD6fonnfZhN1JIOhV2iJCPeRNSH3V1ISwHf+JWcESzLC3BOLD1T07tmO5dmg==
+react-router@6.22.3:
+  version "6.22.3"
+  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.22.3.tgz#9d9142f35e08be08c736a2082db5f0c9540a885e"
+  integrity sha512-dr2eb3Mj5zK2YISHK++foM9w4eBnO23eKnZEDs7c880P6oKbrjz/Svg9+nxqtHQK+oMW4OtjZca0RqPglXxguQ==
   dependencies:
-    "@remix-run/router" "1.15.0"
+    "@remix-run/router" "1.15.3"
 
 react-scripts@^5.0.1:
   version "5.0.1"
@@ -11046,9 +11041,9 @@ react-shallow-renderer@^16.15.0:
     react-is "^16.12.0 || ^17.0.0 || ^18.0.0"
 
 react-simple-keyboard@^3.6.27:
-  version "3.7.78"
-  resolved "https://registry.yarnpkg.com/react-simple-keyboard/-/react-simple-keyboard-3.7.78.tgz#137ce5442222b3eaabccab2a68f8456e38269f88"
-  integrity sha512-ZmabFPE11pTfMS2MGbOzVjAsgzR6vRg4jBzBRSq6XlhOaRkdoFKN4NLpJ33pX5FQfgG8zgTtxf7S7WmFCyEKCw==
+  version "3.7.94"
+  resolved "https://registry.yarnpkg.com/react-simple-keyboard/-/react-simple-keyboard-3.7.94.tgz#82ec2f9fe54b1506b3108c7b700c18271c921007"
+  integrity sha512-ET4EjljnwpYlB+LfVoFmm7MNLUcjACfOVYBbzbJQNqyYzMhVn4s/Y9E7QsiXPUlJ5qzqK/x4i8buvh/tIhscEA==
 
 react-smooth@^2.0.2:
   version "2.0.3"
@@ -11583,9 +11578,9 @@ sass-loader@^12.3.0:
     neo-async "^2.6.2"
 
 sass@^1.63.6:
-  version "1.70.0"
-  resolved "https://registry.yarnpkg.com/sass/-/sass-1.70.0.tgz#761197419d97b5358cb25f9dd38c176a8a270a75"
-  integrity sha512-uUxNQ3zAHeAx5nRFskBnrWzDUJrrvpCPD5FNAoRvTi0WwremlheES3tg+56PaVtCs5QDRX5CBLxxKMDJMEa1WQ==
+  version "1.72.0"
+  resolved "https://registry.yarnpkg.com/sass/-/sass-1.72.0.tgz#5b9978943fcfb32b25a6a5acb102fc9dabbbf41c"
+  integrity sha512-Gpczt3WA56Ly0Mn8Sl21Vj94s1axi9hDIzDFn9Ph9x3C3p4nNyvsqJoQyVXKou6cBlfFWEgRW4rT8Tb4i3XnVA==
   dependencies:
     chokidar ">=3.0.0 <4.0.0"
     immutable "^4.0.0"
@@ -12689,16 +12684,11 @@ tslib@^1.8.1, tslib@^1.9.2:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
-tslib@^2.0.0, tslib@~2.6.2:
+tslib@^2.0.0, tslib@^2.0.3, tslib@^2.4.0, tslib@~2.6.2:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
   integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
 
-tslib@^2.0.3, tslib@^2.4.0:
-  version "2.5.3"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.3.tgz#24944ba2d990940e6e982c4bea147aba80209913"
-  integrity sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w==
-
 tsutils@^3.21.0:
   version "3.21.0"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623"