refactor: JSX.Element -> React.JSX.Element

https://github.com/styled-components/styled-components/issues/4359

src/components/RestartSnackbar.tsx

@@ -34,7 +34,7 @@ export enum RestartSnackbarType {
 
 export function useRestartSnackbar(
   configs?: { restartType?: RestartSnackbarType; waitBeforeCountDown?: number; waitBeforeRestart?: number; workspace?: IWorkspace },
-): [() => void, JSX.Element] {
+): [() => void, React.JSX.Element] {
   const { waitBeforeCountDown = 1000, waitBeforeRestart = 10_000, restartType = RestartSnackbarType.App, workspace } = configs ?? {};
   const { t } = useTranslation();
   const [opened, openedSetter] = useState(false);

src/components/StorageService/SearchGithubRepo.tsx

@@ -66,7 +66,7 @@ interface Props {
   isCreateMainWorkspace: boolean;
   wikiFolderNameSetter?: (value: string) => void;
 }
-export default function SearchGithubRepo(props: Props): JSX.Element {
+export default function SearchGithubRepo(props: Props): React.JSX.Element {
   const userInfos = useUserInfoObservable();
   const githubUsername = userInfos?.['github-userName'];
   const accessToken = userInfos?.['github-token'];
@@ -105,7 +105,7 @@ function SearchGithubRepoResultList({
   isCreateMainWorkspace,
   githubUsername,
   accessToken,
-}: Props & ITokens): JSX.Element {
+}: Props & ITokens): React.JSX.Element {
   const { t } = useTranslation();
 
   const onSelectRepo = useCallback(

src/components/TokenForm/GitTokenForm.tsx

@@ -28,9 +28,9 @@ GitTokenInput.defaultProps = {
 };
 
 export function GitTokenForm(props: {
-  children?: JSX.Element | Array<JSX.Element | undefined | string>;
+  children?: React.JSX.Element | Array<React.JSX.Element | undefined | string>;
   storageService: SupportedStorageServices;
-}): JSX.Element {
+}): React.JSX.Element {
   const { children, storageService } = props;
   const { t } = useTranslation();
 

src/components/TokenForm/index.tsx

@@ -57,7 +57,7 @@ interface Props {
  * Create storage provider's token.
  * @returns
  */
-export function TokenForm({ storageProvider, storageProviderSetter }: Props): JSX.Element {
+export function TokenForm({ storageProvider, storageProviderSetter }: Props): React.JSX.Element {
   const { t } = useTranslation();
   let [currentTab, currentTabSetter] = useState<SupportedStorageServices>(SupportedStorageServices.github);
   // use external controls if provided

src/components/icon/CommandPaletteSVG.tsx

@@ -2,7 +2,7 @@
 import { ForwardedRef, forwardRef } from 'react';
 import { SVGContainer } from './SVGContainer';
 
-function CommandPaletteSVG(): JSX.Element {
+function CommandPaletteSVG(): React.JSX.Element {
   return (
     <svg width='22pt' height='22pt' viewBox='0 0 512 512' style={{ transform: 'rotate(225deg)' }} fill='currentColor'>
       <path

src/pages/About.tsx

@@ -65,7 +65,7 @@ const Link = styled.span`
   }
 `;
 
-export default function About(): JSX.Element {
+export default function About(): React.JSX.Element {
   const { t } = useTranslation();
   const versions = usePromiseValue(async () => {
     const processVersions = await window.service.context.get('environmentVersions');

src/pages/AddWorkspace/CloneWikiDoneButton.tsx

@@ -9,7 +9,7 @@ import { useCloneWiki, useValidateCloneWiki } from './useCloneWiki';
 import type { IWikiWorkspaceFormProps } from './useForm';
 import { useWikiCreationProgress } from './useIndicator';
 
-export function CloneWikiDoneButton({ form, isCreateMainWorkspace, errorInWhichComponentSetter }: IWikiWorkspaceFormProps): JSX.Element {
+export function CloneWikiDoneButton({ form, isCreateMainWorkspace, errorInWhichComponentSetter }: IWikiWorkspaceFormProps): React.JSX.Element {
   const { t } = useTranslation();
   const [hasError, wikiCreationMessage, wikiCreationMessageSetter, hasErrorSetter] = useValidateCloneWiki(
     isCreateMainWorkspace,

src/pages/AddWorkspace/CloneWikiForm.tsx

@@ -9,7 +9,7 @@ import { CreateContainer, LocationPickerButton, LocationPickerContainer, Locatio
 import { useValidateCloneWiki } from './useCloneWiki';
 import type { IWikiWorkspaceFormProps } from './useForm';
 
-export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichComponent, errorInWhichComponentSetter }: IWikiWorkspaceFormProps): JSX.Element {
+export function CloneWikiForm({ form, isCreateMainWorkspace, errorInWhichComponent, errorInWhichComponentSetter }: IWikiWorkspaceFormProps): React.JSX.Element {
   const { t } = useTranslation();
   useValidateCloneWiki(isCreateMainWorkspace, form, errorInWhichComponentSetter);
   return (

src/pages/AddWorkspace/Description.tsx

@@ -29,7 +29,7 @@ export function MainSubWikiDescription({
 }: {
   isCreateMainWorkspace: boolean;
   isCreateMainWorkspaceSetter: (is: boolean) => void;
-}): JSX.Element {
+}): React.JSX.Element {
   const { t } = useTranslation();
   const label = isCreateMainWorkspace ? t('AddWorkspace.MainWorkspace') : t('AddWorkspace.SubWorkspace');
   const description = isCreateMainWorkspace ? t('AddWorkspace.MainWorkspaceDescription') : t('AddWorkspace.SubWorkspaceDescription');
@@ -63,7 +63,7 @@ export function SyncedWikiDescription({
 }: {
   isCreateSyncedWorkspace: boolean;
   isCreateSyncedWorkspaceSetter: (is: boolean) => void;
-}): JSX.Element {
+}): React.JSX.Element {
   const { t } = useTranslation();
   const label = isCreateSyncedWorkspace ? t('AddWorkspace.SyncedWorkspace') : t('AddWorkspace.LocalWorkspace');
   const description = isCreateSyncedWorkspace ? t('AddWorkspace.SyncedWorkspaceDescription') : t('AddWorkspace.LocalWorkspaceDescription');

src/pages/AddWorkspace/ExistedWikiDoneButton.tsx

@@ -13,7 +13,7 @@ export function ExistedWikiDoneButton({
   isCreateMainWorkspace,
   isCreateSyncedWorkspace,
   errorInWhichComponentSetter,
-}: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean; isCreateSyncedWorkspace: boolean }): JSX.Element {
+}: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean; isCreateSyncedWorkspace: boolean }): React.JSX.Element {
   const { t } = useTranslation();
   const [hasError, wikiCreationMessage, wikiCreationMessageSetter, hasErrorSetter] = useValidateExistedWiki(
     isCreateMainWorkspace,

src/pages/AddWorkspace/ExistedWikiForm.tsx

@@ -15,7 +15,7 @@ export function ExistedWikiForm({
   isCreateSyncedWorkspace,
   errorInWhichComponent,
   errorInWhichComponentSetter,
-}: IWikiWorkspaceFormProps & { isCreateSyncedWorkspace: boolean }): JSX.Element {
+}: IWikiWorkspaceFormProps & { isCreateSyncedWorkspace: boolean }): React.JSX.Element {
   const { t } = useTranslation();
   const {
     wikiFolderLocation,

src/pages/AddWorkspace/FormComponents.tsx

@@ -56,7 +56,7 @@ export const WikiLocation = styled(Typography)`
 `;
 WikiLocation.defaultProps = { variant: 'body2', noWrap: true, display: 'inline', align: 'center' };
 
-export function ReportErrorButton(props: { message: string }): JSX.Element {
+export function ReportErrorButton(props: { message: string }): React.JSX.Element {
   const { t } = useTranslation();
   return (
     <Tooltip title={(t('Dialog.ReportBugDetail') ?? '') + (t('Menu.ReportBugViaGithub') ?? '')}>
@@ -81,7 +81,7 @@ const AbsoluteFab = styled(Fab)`
   color: rgba(0, 0, 0, 0.2);
   font-size: 10px;
 `;
-export function ReportErrorFabButton(props: { message: string }): JSX.Element {
+export function ReportErrorFabButton(props: { message: string }): React.JSX.Element {
   const { t } = useTranslation();
   return (
     <Tooltip title={(t('Dialog.ReportBugDetail') ?? '') + (t('Menu.ReportBugViaGithub') ?? '')}>

src/pages/AddWorkspace/GitRepoUrlForm.tsx

@@ -21,7 +21,7 @@ export function GitRepoUrlForm({
   isCreateMainWorkspace: boolean;
   storageProvider?: SupportedStorageServices;
   wikiFolderNameSetter?: (nextName: string) => void;
-}): JSX.Element {
+}): React.JSX.Element {
   const { t } = useTranslation();
   return (
     <CreateContainer elevation={2} square>

src/pages/AddWorkspace/ImportHtmlWikiDoneButton.tsx

@@ -13,7 +13,7 @@ export function ImportHtmlWikiDoneButton({
   isCreateMainWorkspace,
   isCreateSyncedWorkspace,
   errorInWhichComponentSetter,
-}: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean; isCreateSyncedWorkspace: boolean }): JSX.Element {
+}: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean; isCreateSyncedWorkspace: boolean }): React.JSX.Element {
   const { t } = useTranslation();
   const [hasError, wikiCreationMessage, wikiCreationMessageSetter, hasErrorSetter] = useValidateHtmlWiki(
     isCreateMainWorkspace,

src/pages/AddWorkspace/ImportHtmlWikiForm.tsx

@@ -13,7 +13,7 @@ export function ImportHtmlWikiForm({
   isCreateSyncedWorkspace,
   errorInWhichComponent,
   errorInWhichComponentSetter,
-}: IWikiWorkspaceFormProps & { isCreateSyncedWorkspace: boolean }): JSX.Element {
+}: IWikiWorkspaceFormProps & { isCreateSyncedWorkspace: boolean }): React.JSX.Element {
   const { t } = useTranslation();
   const { wikiHtmlPathSetter, wikiFolderLocation, wikiFolderName, wikiHtmlPath, parentFolderLocation, wikiFolderNameSetter } = form;
 

src/pages/AddWorkspace/NewWikiDoneButton.tsx

@@ -14,7 +14,7 @@ export function NewWikiDoneButton({
   isCreateMainWorkspace,
   isCreateSyncedWorkspace,
   errorInWhichComponentSetter,
-}: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean; isCreateSyncedWorkspace: boolean }): JSX.Element {
+}: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean; isCreateSyncedWorkspace: boolean }): React.JSX.Element {
   const { t } = useTranslation();
   const [hasError, wikiCreationMessage, wikiCreationMessageSetter, hasErrorSetter] = useValidateNewWiki(
     isCreateMainWorkspace,

src/pages/AddWorkspace/NewWikiForm.tsx

@@ -14,7 +14,7 @@ export function NewWikiForm({
   isCreateSyncedWorkspace,
   errorInWhichComponent,
   errorInWhichComponentSetter,
-}: IWikiWorkspaceFormProps & { isCreateSyncedWorkspace: boolean }): JSX.Element {
+}: IWikiWorkspaceFormProps & { isCreateSyncedWorkspace: boolean }): React.JSX.Element {
   const { t } = useTranslation();
   useValidateNewWiki(isCreateMainWorkspace, isCreateSyncedWorkspace, form, errorInWhichComponentSetter);
   return (

src/pages/AddWorkspace/index.tsx

@@ -71,7 +71,7 @@ const AdvancedSettingsAccordionSummary = styled(AccordionSummary)`
   margin-top: 10px;
 `;
 
-export function AddWorkspace(): JSX.Element {
+export function AddWorkspace(): React.JSX.Element {
   const { t } = useTranslation();
   const [currentTab, currentTabSetter] = useState<CreateWorkspaceTabs>(
     (window.meta() as IPossibleWindowMeta<WindowMeta[WindowNames.addWorkspace]>)?.addWorkspaceTab ?? CreateWorkspaceTabs.CreateNewWiki,

src/pages/EditWorkspace/index.tsx

@@ -160,7 +160,7 @@ const getValidIconPath = (iconPath?: string | null): string => {
 
 const workspaceID = (window.meta() as WindowMeta[WindowNames.editWorkspace]).workspaceID!;
 
-export default function EditWorkspace(): JSX.Element {
+export default function EditWorkspace(): React.JSX.Element {
   const { t } = useTranslation();
   const originalWorkspace = useWorkspaceObservable(workspaceID);
   const [requestRestartCountDown, RestartSnackbar] = useRestartSnackbar({ waitBeforeCountDown: 0, workspace: originalWorkspace, restartType: RestartSnackbarType.Wiki });

src/pages/Guide/NewUserMessage.tsx

@@ -61,7 +61,7 @@ export interface IProps {
   themeSource: IPreferences['themeSource'];
 }
 
-export function NewUserMessage(props: IProps): JSX.Element {
+export function NewUserMessage(props: IProps): React.JSX.Element {
   const { t } = useTranslation();
   return (
     <AddWorkspaceGuideInfoContainer

src/pages/Guide/index.tsx

@@ -23,7 +23,7 @@ const InnerContentRoot = styled.div`
   height: 100%;
 `;
 
-export function Guide(): JSX.Element {
+export function Guide(): React.JSX.Element {
   const workspacesList = useWorkspacesListObservable();
   const [wikiCreationMessage, wikiCreationMessageSetter] = useState('');
   useAutoCreateFirstWorkspace(workspacesList, wikiCreationMessageSetter);

src/pages/Help/index.tsx

@@ -21,7 +21,7 @@ const StyledDivider = styled(Divider)`
   margin: 10px 0;
 `;
 
-export function Help(): JSX.Element {
+export function Help(): React.JSX.Element {
   const { t } = useTranslation();
   const preference = usePreferenceObservable();
   const items = useLoadHelpPagesList(preference?.language);

src/pages/Main/FindInPage.tsx

@@ -19,7 +19,7 @@ const InfoContainer = styled.div`
   padding: 0 12px;
 `;
 
-export default function FindInPage(): JSX.Element | null {
+export default function FindInPage(): React.JSX.Element | null {
   const { t } = useTranslation();
   const [open, openSetter] = useState(false);
   const [text, textSetter] = useState('');

src/pages/Main/PageIconAndSelector/PageSelectorBase.tsx

@@ -139,7 +139,7 @@ export function PageSelectorBase({
   pageClickedLoading = false,
   onClick = () => {},
   icon,
-}: Props): JSX.Element {
+}: Props): React.JSX.Element {
   const { t } = useTranslation();
   const [shortPageName, shortPageNameSetter] = useState<string>(t('Loading'));
   useEffect(() => {

src/pages/Main/PageIconAndSelector/SortablePageSelectorButton.tsx

@@ -17,7 +17,7 @@ export interface ISortableItemProps {
   showSidebarTexts: boolean;
 }
 
-export function SortablePageSelectorButton({ index, page, showSidebarTexts, showSideBarIcon }: ISortableItemProps): JSX.Element {
+export function SortablePageSelectorButton({ index, page, showSidebarTexts, showSideBarIcon }: ISortableItemProps): React.JSX.Element {
   const { t } = useTranslation();
   const { active, id, type } = page;
   const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id });

src/pages/Main/PageIconAndSelector/SortablePageSelectorList.tsx

@@ -10,7 +10,7 @@ export interface ISortableListProps {
   showSideBarText: boolean;
 }
 
-export function SortablePageSelectorList({ pagesList, showSideBarText, showSideBarIcon }: ISortableListProps): JSX.Element {
+export function SortablePageSelectorList({ pagesList, showSideBarText, showSideBarIcon }: ISortableListProps): React.JSX.Element {
   const dndSensors = useSensors(
     useSensor(PointerSensor, {
       activationConstraint: {

src/pages/Main/Sidebar.tsx

@@ -70,7 +70,7 @@ const IconButton = styled(IconButtonRaw)`
   color: ${({ theme }) => theme.palette.action.active};
 `;
 
-const SidebarContainer = ({ children }: { children: React.ReactNode }): JSX.Element => {
+const SidebarContainer = ({ children }: { children: React.ReactNode }): React.JSX.Element => {
   const platform = usePromiseValue(async () => await window.service.context.get('platform'));
   // use native scroll bar on macOS
   if (platform === 'darwin') {
@@ -79,7 +79,7 @@ const SidebarContainer = ({ children }: { children: React.ReactNode }): JSX.Elem
   return <SidebarWithStyle>{children}</SidebarWithStyle>;
 };
 
-export function SideBar(): JSX.Element {
+export function SideBar(): React.JSX.Element {
   /** is title bar on. This only take effect after reload, so we don't want to get this preference from observable */
   const titleBar = usePromiseValue<boolean>(async () => await window.service.preference.get('titleBar'), false)!;
 

src/pages/Main/WorkspaceIconAndSelector/SortableWorkspaceSelectorButton.tsx

@@ -17,7 +17,7 @@ export interface ISortableItemProps {
   workspace: IWorkspaceWithMetadata;
 }
 
-export function SortableWorkspaceSelectorButton({ index, workspace, showSidebarTexts, showSideBarIcon }: ISortableItemProps): JSX.Element {
+export function SortableWorkspaceSelectorButton({ index, workspace, showSidebarTexts, showSideBarIcon }: ISortableItemProps): React.JSX.Element {
   const { t } = useTranslation();
   const { active, id, name, picturePath, hibernated, transparentBackground } = workspace;
   const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id });

src/pages/Main/WorkspaceIconAndSelector/SortableWorkspaceSelectorList.tsx

@@ -10,7 +10,7 @@ export interface ISortableListProps {
   workspacesList: IWorkspaceWithMetadata[];
 }
 
-export function SortableWorkspaceSelectorList({ workspacesList, showSideBarText, showSideBarIcon }: ISortableListProps): JSX.Element {
+export function SortableWorkspaceSelectorList({ workspacesList, showSideBarText, showSideBarIcon }: ISortableListProps): React.JSX.Element {
   const dndSensors = useSensors(
     useSensor(PointerSensor, {
       activationConstraint: {

src/pages/Main/WorkspaceIconAndSelector/WorkspaceSelectorBase.tsx

@@ -149,7 +149,7 @@ export function WorkspaceSelectorBase({
   workspaceName,
   workspaceClickedLoading = false,
   onClick = () => {},
-}: Props): JSX.Element {
+}: Props): React.JSX.Element {
   const { t } = useTranslation();
   const [shortWorkspaceName, shortWorkspaceNameSetter] = useState<string>(t('Loading'));
   useEffect(() => {

src/pages/Main/index.tsx

@@ -61,7 +61,7 @@ const ContentRoot = styled.div<{ $sidebar: boolean }>`
 
 const windowName = window.meta().windowName;
 
-export default function Main(): JSX.Element {
+export default function Main(): React.JSX.Element {
   const { t } = useTranslation();
   useInitialPage();
   const preferences = usePreferenceObservable();

src/pages/Notifications/index.tsx

@@ -67,7 +67,7 @@ const pauseNotification = (tilDate: Date): void => {
   void window.remote.closeCurrentWindow();
 };
 
-export default function Notifications(): JSX.Element {
+export default function Notifications(): React.JSX.Element {
   const { t } = useTranslation();
   const preference = usePreferenceObservable();
   const pauseNotificationsInfo = useNotificationInfoObservable();
@@ -76,7 +76,7 @@ export default function Notifications(): JSX.Element {
     return <Root>{t('Loading')}</Root>;
   }
 
-  const renderList = (): JSX.Element => {
+  const renderList = (): React.JSX.Element => {
     if (pauseNotificationsInfo !== undefined) {
       return (
         <List>

src/pages/Preferences/SectionsSideBar.tsx

@@ -37,7 +37,7 @@ const SideMenuListItem = styled(ListItemButton)<{ index: number }>`
   animation-delay: ${({ index }) => index * 0.05}s;
 `;
 
-export function SectionSideBar(props: ISectionProps): JSX.Element {
+export function SectionSideBar(props: ISectionProps): React.JSX.Element {
   return (
     <SideBar>
       <List dense>

src/pages/Preferences/index.tsx

@@ -33,7 +33,7 @@ const Inner = styled.div`
   float: right;
 `;
 
-export default function Preferences(): JSX.Element {
+export default function Preferences(): React.JSX.Element {
   const { t } = useTranslation();
   const sections = usePreferenceSections();
   const [requestRestartCountDown, RestartSnackbar] = useRestartSnackbar();

src/pages/Preferences/sections/DeveloperTools.tsx

@@ -8,7 +8,7 @@ import { usePromiseValue } from '@/helpers/useServiceValue';
 import { Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function DeveloperTools(props: ISectionProps): JSX.Element {
+export function DeveloperTools(props: ISectionProps): React.JSX.Element {
   const { t } = useTranslation();
 
   const [LOG_FOLDER, SETTINGS_FOLDER, V8_CACHE_FOLDER] = usePromiseValue<[string | undefined, string | undefined, string | undefined]>(

src/pages/Preferences/sections/Downloads.tsx

@@ -7,7 +7,7 @@ import { usePreferenceObservable } from '@services/preferences/hooks';
 import { Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Downloads(props: Required<ISectionProps>): JSX.Element {
+export function Downloads(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/FriendLinks.tsx

@@ -14,7 +14,7 @@ const Logo = styled.img`
   height: 28px;
 `;
 
-export function FriendLinks(props: ISectionProps): JSX.Element {
+export function FriendLinks(props: ISectionProps): React.JSX.Element {
   const { t } = useTranslation();
 
   return (

src/pages/Preferences/sections/General.tsx

@@ -17,7 +17,7 @@ const getThemeString = (theme: IPreferences['themeSource']): string => {
   return 'System default';
 };
 
-export function General(props: Required<ISectionProps>): JSX.Element {
+export function General(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/Languages.tsx

@@ -10,7 +10,7 @@ import { WindowNames } from '@services/windows/WindowProperties';
 import { InputLabel, Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Languages(props: Partial<ISectionProps> & { languageSelectorOnly?: boolean }): JSX.Element {
+export function Languages(props: Partial<ISectionProps> & { languageSelectorOnly?: boolean }): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/Miscellaneous.tsx

@@ -8,7 +8,7 @@ import type { ISectionProps } from '../useSections';
 
 import { WindowNames } from '@services/windows/WindowProperties';
 
-export function Miscellaneous(props: ISectionProps): JSX.Element {
+export function Miscellaneous(props: ISectionProps): React.JSX.Element {
   const { t } = useTranslation();
 
   return (

src/pages/Preferences/sections/Network.tsx

@@ -7,7 +7,7 @@ import { usePreferenceObservable } from '@services/preferences/hooks';
 import { Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Network(props: ISectionProps): JSX.Element {
+export function Network(props: ISectionProps): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/Notifications.tsx

@@ -12,7 +12,7 @@ import { WindowNames } from '@services/windows/WindowProperties';
 import { Link, ListItemVertical, Paper, SectionTitle, TimePickerContainer } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Notifications(props: Required<ISectionProps>): JSX.Element {
+export function Notifications(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/Performance.tsx

@@ -6,7 +6,7 @@ import { usePreferenceObservable } from '@services/preferences/hooks';
 import { Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Performance(props: Required<ISectionProps>): JSX.Element {
+export function Performance(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/PrivacyAndSecurity.tsx

@@ -8,7 +8,7 @@ import { usePreferenceObservable } from '@services/preferences/hooks';
 import { Link, Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function PrivacyAndSecurity(props: Required<ISectionProps>): JSX.Element {
+export function PrivacyAndSecurity(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/Sync.tsx

@@ -11,7 +11,7 @@ import { WindowNames } from '@services/windows/WindowProperties';
 import { Paper, SectionTitle, TimePickerContainer } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Sync(props: Required<ISectionProps>): JSX.Element {
+export function Sync(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/Preferences/sections/System.tsx

@@ -8,7 +8,7 @@ import { getOpenAtLoginString, useSystemPreferenceObservable } from '@services/s
 import { Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function System(props: ISectionProps): JSX.Element {
+export function System(props: ISectionProps): React.JSX.Element {
   const { t } = useTranslation();
 
   const systemPreference = useSystemPreferenceObservable();

src/pages/Preferences/sections/TiddlyWiki.tsx

@@ -9,7 +9,7 @@ import { useUserInfoObservable } from '@services/auth/hooks';
 import { ListItemVertical, Paper, SectionTitle, TextField } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function TiddlyWiki(props: Partial<ISectionProps>): JSX.Element {
+export function TiddlyWiki(props: Partial<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const userInfo = useUserInfoObservable();

src/pages/Preferences/sections/Updates.tsx

@@ -10,7 +10,7 @@ import { IUpdaterStatus } from '@services/updater/interface';
 import { Paper, SectionTitle } from '../PreferenceComponents';
 import type { ISectionProps } from '../useSections';
 
-export function Updates(props: Required<ISectionProps>): JSX.Element {
+export function Updates(props: Required<ISectionProps>): React.JSX.Element {
   const { t } = useTranslation();
 
   const preference = usePreferenceObservable();

src/pages/SpellcheckLanguages/index.tsx

@@ -45,7 +45,7 @@ Button.defaultProps = {
   disableElevation: true,
 };
 
-export default function SpellcheckLanguages(): JSX.Element {
+export default function SpellcheckLanguages(): React.JSX.Element {
   const { t } = useTranslation();
   const preference = usePreferenceObservable();
   if (preference === undefined) {

src/pages/WikiBackground/ErrorMessage.tsx

@@ -30,7 +30,7 @@ interface IWikiErrorMessagesProps {
   activeWorkspace: IWorkspaceWithMetadata;
 }
 
-export function WikiErrorMessages(props: IWikiErrorMessagesProps): JSX.Element {
+export function WikiErrorMessages(props: IWikiErrorMessagesProps): React.JSX.Element {
   const { t } = useTranslation();
   const wikiLogs = usePromiseValue(async () => await window.service.wiki.getWikiErrorLogs(props.activeWorkspace.id, props.activeWorkspace.name));
   if (wikiLogs !== undefined) {
@@ -82,7 +82,7 @@ interface IViewLoadErrorMessagesProps {
   activeWorkspaceMetadata: IWorkspaceMetaData;
 }
 
-export function ViewLoadErrorMessages(props: IViewLoadErrorMessagesProps): JSX.Element {
+export function ViewLoadErrorMessages(props: IViewLoadErrorMessagesProps): React.JSX.Element {
   const { t } = useTranslation();
   const requestReload = useCallback(async (): Promise<void> => {
     await window.service.workspace.updateMetaData(props.activeWorkspace.id, { didFailLoadErrorMessage: null, isLoading: false });

src/pages/WikiBackground/index.tsx

@@ -20,7 +20,7 @@ const InnerContentRoot = styled.div`
   height: 100%;
 `;
 
-export function WikiBackground(): JSX.Element {
+export function WikiBackground(): React.JSX.Element {
   const { t } = useTranslation();
   const workspacesList = useWorkspacesListObservable();
 

src/pages/index.tsx

@@ -11,7 +11,7 @@ const DialogNotifications = lazy(() => import('./Notifications'));
 const DialogPreferences = lazy(() => import('./Preferences'));
 const SpellcheckLanguages = lazy(() => import('./SpellcheckLanguages'));
 
-export function Pages(): JSX.Element {
+export function Pages(): React.JSX.Element {
   const [, setLocation] = useLocation();
   useEffect(() => {
     setLocation(`/${window.meta().windowName}`);

src/renderer.tsx

@@ -25,7 +25,7 @@ import { useHashLocation } from 'wouter/use-hash-location';
 import { RootStyle } from './components/RootStyle';
 import { Pages } from './pages';
 
-function App(): JSX.Element {
+function App(): React.JSX.Element {
   const theme = useThemeObservable();
 
   return (