Fix JSX namespace errors

RichDom2185 · RichDom2185 · commit 82a0121d859a · 2025-08-09T16:08:57.000+08:00
diff --git a/src/commons/ContentDisplay.tsx b/src/commons/ContentDisplay.tsx
@@ -1,5 +1,5 @@
 import { Card, Elevation } from '@blueprintjs/core';
-import React, { useEffect } from 'react';
+import React, { type JSX, useEffect } from 'react';
 
 export type ContentDisplayProps = {
   fullWidth?: boolean;
diff --git a/src/commons/achievement/control/AchievementEditor.tsx b/src/commons/achievement/control/AchievementEditor.tsx
@@ -1,4 +1,4 @@
-import React, { useContext, useState } from 'react';
+import React, { type JSX, useContext, useState } from 'react';
 import { AchievementContext } from 'src/features/achievement/AchievementConstants';
 
 import AchievementAdder from './achievementEditor/AchievementAdder';
diff --git a/src/commons/achievement/control/GoalEditor.tsx b/src/commons/achievement/control/GoalEditor.tsx
@@ -1,4 +1,4 @@
-import React, { useContext, useState } from 'react';
+import React, { type JSX, useContext, useState } from 'react';
 import { AchievementContext } from 'src/features/achievement/AchievementConstants';
 
 import EditableGoal from './goalEditor/EditableGoal';
diff --git a/src/commons/assessment/Assessment.tsx b/src/commons/assessment/Assessment.tsx
@@ -20,7 +20,7 @@ import {
 import { IconNames } from '@blueprintjs/icons';
 import classNames from 'classnames';
 import { sortBy } from 'lodash';
-import React, { useEffect, useMemo, useState } from 'react';
+import React, { type JSX, useEffect, useMemo, useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { Navigate, NavLink, useLoaderData, useParams } from 'react-router';
 import { numberRegExp } from 'src/features/academy/AcademyTypes';
diff --git a/src/commons/controlBar/ControlBar.tsx b/src/commons/controlBar/ControlBar.tsx
@@ -1,6 +1,6 @@
 import { Classes } from '@blueprintjs/core';
 import classNames from 'classnames';
-import React from 'react';
+import React, { type JSX } from 'react';
 
 export type ControlBarProps = {
   editorButtons: Array<JSX.Element | null>;
diff --git a/src/commons/delay/Delay.tsx b/src/commons/delay/Delay.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { type JSX } from 'react';
 
 type Props = {
   children: JSX.Element;
diff --git a/src/commons/fileSystemView/FileSystemViewContextMenu.tsx b/src/commons/fileSystemView/FileSystemViewContextMenu.tsx
@@ -1,7 +1,7 @@
 import { Classes } from '@blueprintjs/core';
 import { ControlledMenu, MenuItem, useMenuState } from '@szhsin/react-menu';
 import classNames from 'classnames';
-import React from 'react';
+import React, { type JSX } from 'react';
 import classes from 'src/styles/ContextMenu.module.scss';
 
 type Props = {
diff --git a/src/commons/mobileWorkspace/mobileSideContent/MobileSideContent.tsx b/src/commons/mobileWorkspace/mobileSideContent/MobileSideContent.tsx
@@ -1,6 +1,6 @@
 import { Classes, Icon, Tab, Tabs, Tooltip } from '@blueprintjs/core';
 import classNames from 'classnames';
-import React from 'react';
+import React, { type JSX } from 'react';
 import { SideContentProps } from 'src/commons/sideContent/SideContent';
 import { generateIconId } from 'src/commons/sideContent/SideContentHelper';
 import SideContentProvider from 'src/commons/sideContent/SideContentProvider';
diff --git a/src/commons/profile/Profile.tsx b/src/commons/profile/Profile.tsx
@@ -1,6 +1,6 @@
 import { Drawer, DrawerSize, NonIdealState, Spinner } from '@blueprintjs/core';
 import { IconName, IconNames } from '@blueprintjs/icons';
-import React, { useEffect, useState } from 'react';
+import React, { type JSX, useEffect, useState } from 'react';
 import { useDispatch } from 'react-redux';
 
 import SessionActions from '../application/actions/SessionActions';
diff --git a/src/commons/repl/Repl.tsx b/src/commons/repl/Repl.tsx
@@ -4,7 +4,7 @@ import classNames from 'classnames';
 import { parseError } from 'js-slang';
 import { Chapter, Variant } from 'js-slang/dist/types';
 import { stringify } from 'js-slang/dist/utils/stringify';
-import React from 'react';
+import React, { type JSX } from 'react';
 
 import type { InterpreterOutput, ResultOutput } from '../application/ApplicationTypes';
 import { ExternalLibraryName } from '../application/types/ExternalTypes';
diff --git a/src/commons/repl/ReplInput.tsx b/src/commons/repl/ReplInput.tsx
@@ -2,7 +2,7 @@ import { Classes } from '@blueprintjs/core';
 import { Ace } from 'ace-builds';
 import classNames from 'classnames';
 import { Chapter, Variant } from 'js-slang/dist/types';
-import React from 'react';
+import React, { type JSX } from 'react';
 import AceEditor from 'react-ace';
 import ReactAce from 'react-ace/lib/ace';
 
diff --git a/src/commons/sideBar/SideBar.tsx b/src/commons/sideBar/SideBar.tsx
@@ -1,6 +1,6 @@
 import { Card, Icon, IconName } from '@blueprintjs/core';
 import classNames from 'classnames';
-import React from 'react';
+import React, { type JSX } from 'react';
 
 import { SideContentType } from '../sideContent/SideContentTypes';
 
diff --git a/src/commons/sideContent/SideContent.tsx b/src/commons/sideContent/SideContent.tsx
@@ -1,4 +1,5 @@
 import { Card, Icon, Tab, TabProps, Tabs, Tooltip } from '@blueprintjs/core';
+import type { JSX } from 'react';
 
 import { assertType } from '../utils/TypeHelper';
 import { generateTabAlert, getTabId } from './SideContentHelper';
diff --git a/src/commons/sideContent/SideContentProvider.tsx b/src/commons/sideContent/SideContentProvider.tsx
@@ -1,4 +1,4 @@
-import { useCallback } from 'react';
+import { type JSX, useCallback } from 'react';
 
 import { useSideContent } from './SideContentHelper';
 import type {
diff --git a/src/commons/sideContent/SideContentTypes.ts b/src/commons/sideContent/SideContentTypes.ts
@@ -1,4 +1,5 @@
 import { IconName } from '@blueprintjs/core';
+import type { JSX } from 'react';
 
 import { DebuggerContext, WorkspaceLocation } from '../workspace/WorkspaceTypes';
 
diff --git a/src/commons/utils/notifications/NotificationsHelper.ts b/src/commons/utils/notifications/NotificationsHelper.ts
@@ -1,4 +1,5 @@
 import { Intent, ToastProps } from '@blueprintjs/core';
+import type { JSX } from 'react';
 
 import { notification } from './createNotification';
 
diff --git a/src/features/dataVisualizer/dataVisualizer.tsx b/src/features/dataVisualizer/dataVisualizer.tsx
@@ -1,3 +1,4 @@
+import type { JSX } from 'react';
 import { Stage } from 'react-konva';
 
 import { Config } from './Config';
diff --git a/src/features/dataVisualizer/dataVisualizerTypes.ts b/src/features/dataVisualizer/dataVisualizerTypes.ts
@@ -1,3 +1,5 @@
+import type { JSX } from 'react';
+
 // Source-related types
 export type Data = any;
 export type Pair = [Data, Data];
diff --git a/src/features/dataVisualizer/tree/ArrayTreeNode.tsx b/src/features/dataVisualizer/tree/ArrayTreeNode.tsx
@@ -1,3 +1,4 @@
+import type { JSX } from 'react';
 import { Group } from 'react-konva';
 
 import { Config } from '../Config';
diff --git a/src/features/dataVisualizer/tree/DrawableTreeNode.tsx b/src/features/dataVisualizer/tree/DrawableTreeNode.tsx
@@ -1,3 +1,5 @@
+import type { JSX } from 'react';
+
 import { TreeNode } from './BaseTreeNode';
 
 /**
diff --git a/src/features/dataVisualizer/tree/FunctionTreeNode.tsx b/src/features/dataVisualizer/tree/FunctionTreeNode.tsx
@@ -1,3 +1,4 @@
+import type { JSX } from 'react';
 import { Group } from 'react-konva';
 
 import { Config } from '../Config';
diff --git a/src/features/dataVisualizer/tree/Tree.tsx b/src/features/dataVisualizer/tree/Tree.tsx
@@ -1,4 +1,5 @@
 import Konva from 'konva';
+import type { JSX } from 'react';
 import { Layer, Text } from 'react-konva';
 
 import { Config } from '../Config';
diff --git a/src/features/sicp/errors/SicpErrors.tsx b/src/features/sicp/errors/SicpErrors.tsx
@@ -1,5 +1,6 @@
 import { NonIdealState } from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
+import type { JSX } from 'react';
 
 export enum SicpErrorType {
   UNEXPECTED_ERROR,
diff --git a/src/features/sicp/parser/ParseJson.tsx b/src/features/sicp/parser/ParseJson.tsx
@@ -1,6 +1,6 @@
 import { Blockquote, Code, H1, H2, H4, Icon, OL, Pre, UL } from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
-import React from 'react';
+import React, { type JSX } from 'react';
 import { Link } from 'react-router';
 import Constants from 'src/commons/utils/Constants';
 import SicpExercise from 'src/pages/sicp/subcomponents/SicpExercise';
diff --git a/src/pages/academy/adminPanel/subcomponents/AddStoriesUserPanel.tsx b/src/pages/academy/adminPanel/subcomponents/AddStoriesUserPanel.tsx
@@ -15,7 +15,7 @@ import { IconNames } from '@blueprintjs/icons';
 import { ColDef } from 'ag-grid-community';
 import { AgGridReact } from 'ag-grid-react';
 import { uniqBy } from 'lodash';
-import React from 'react';
+import React, { type JSX } from 'react';
 import { useCSVReader } from 'react-papaparse';
 import { StoriesRole } from 'src/commons/application/ApplicationTypes';
 
diff --git a/src/pages/academy/adminPanel/subcomponents/AddUserPanel.tsx b/src/pages/academy/adminPanel/subcomponents/AddUserPanel.tsx
@@ -15,7 +15,7 @@ import { IconNames } from '@blueprintjs/icons';
 import { ColDef } from 'ag-grid-community';
 import { AgGridReact } from 'ag-grid-react';
 import { uniqBy } from 'lodash';
-import React from 'react';
+import React, { type JSX } from 'react';
 import { useCSVReader } from 'react-papaparse';
 import { Role } from 'src/commons/application/ApplicationTypes';
 
diff --git a/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewer.tsx b/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewer.tsx
@@ -1,6 +1,6 @@
 import { Icon, Tab, Tabs, Tooltip, Tree, TreeNodeInfo } from '@blueprintjs/core';
 import { cloneDeep } from 'lodash';
-import React from 'react';
+import React, { type JSX } from 'react';
 import { useRequest } from 'src/commons/utils/Hooks';
 import { fetchAssetPaths, s3AssetFolders } from 'src/features/gameSimulator/GameSimulatorService';
 import { deleteS3File } from 'src/features/gameSimulator/GameSimulatorService';
diff --git a/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewerUtils.tsx b/src/pages/academy/gameSimulator/subcomponents/assetViewer/AssetViewerUtils.tsx
@@ -1,5 +1,6 @@
 import { TreeNodeInfo } from '@blueprintjs/core';
 import { set } from 'lodash';
+import type { JSX } from 'react';
 
 type Tree = Record<any, any> | string[] | any;
 
diff --git a/src/pages/githubCallback/__tests__/GitHubCallback.test.tsx b/src/pages/githubCallback/__tests__/GitHubCallback.test.tsx
@@ -1,5 +1,5 @@
 import { render, screen } from '@testing-library/react';
-import { act } from 'react';
+import { act, type JSX } from 'react';
 import { Route, Routes, StaticRouter } from 'react-router';
 import { Mock, vi } from 'vitest';
 
diff --git a/src/pages/sicp/subcomponents/SicpExercise.tsx b/src/pages/sicp/subcomponents/SicpExercise.tsx
@@ -1,5 +1,5 @@
 import { Button, Card, Collapse, Elevation } from '@blueprintjs/core';
-import React from 'react';
+import React, { type JSX } from 'react';
 
 export const noSolutionPlaceholder = (
   <span>

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import React, { useContext, useState } from 'react';`
	`1`	`+import React, { type JSX, useContext, useState } from 'react';`
`2`	`2`	`import { AchievementContext } from 'src/features/achievement/AchievementConstants';`
`3`	`3`
`4`	`4`	`import AchievementAdder from './achievementEditor/AchievementAdder';`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import React from 'react';`
	`1`	`+import React, { type JSX } from 'react';`
`2`	`2`
`3`	`3`	`type Props = {`
`4`	`4`	`children: JSX.Element;`