smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

perf: use UIAppState where possible to reduce UI rerenders (#6560)

Browse source
This commit is contained in:
David Luzar 2023-05-08 10:14:02 +02:00 • committed by GitHub
parent 026949204d
commit 560231d365
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
33 changed files with 155 additions and 125 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/components/main-menu/DefaultItems.tsx
View file

@ -1,10 +1,6 @@
import { getShortcutFromShortcutName } from "../../actions/shortcuts";
import { useI18n } from "../../i18n";
import {
useExcalidrawAppState,
useExcalidrawSetAppState,
useExcalidrawActionManager,
} from "../App";
import { useExcalidrawSetAppState, useExcalidrawActionManager } from "../App";
import {
ExportIcon,
ExportImageIcon,
@ -32,6 +28,7 @@ import clsx from "clsx";
import { useSetAtom } from "jotai";
import { activeConfirmDialogAtom } from "../ActiveConfirmDialog";
import { jotaiScope } from "../../jotai";
import { useUIAppState } from "../../context/ui-appState";
export const LoadScene = () => {
const { t } = useI18n();
@ -139,7 +136,7 @@ ClearCanvas.displayName = "ClearCanvas";
export const ToggleTheme = () => {
const { t } = useI18n();
const appState = useExcalidrawAppState();
const appState = useUIAppState();
const actionManager = useExcalidrawActionManager();
if (!actionManager.isActionEnabled(actionToggleTheme)) {
@ -172,7 +169,7 @@ ToggleTheme.displayName = "ToggleTheme";
export const ChangeCanvasBackground = () => {
const { t } = useI18n();
const appState = useExcalidrawAppState();
const appState = useUIAppState();
const actionManager = useExcalidrawActionManager();
if (appState.viewModeEnabled) {

9
src/components/main-menu/MainMenu.tsx
View file

@ -1,9 +1,5 @@
import React from "react";
import {
useDevice,
useExcalidrawAppState,
useExcalidrawSetAppState,
} from "../App";
import { useDevice, useExcalidrawSetAppState } from "../App";
import DropdownMenu from "../dropdownMenu/DropdownMenu";
import * as DefaultItems from "./DefaultItems";
@ -14,6 +10,7 @@ import { HamburgerMenuIcon } from "../icons";
import { withInternalFallback } from "../hoc/withInternalFallback";
import { composeEventHandlers } from "../../utils";
import { useTunnels } from "../../context/tunnels";
import { useUIAppState } from "../../context/ui-appState";
const MainMenu = Object.assign(
withInternalFallback(
@ -30,7 +27,7 @@ const MainMenu = Object.assign(
}) => {
const { MainMenuTunnel } = useTunnels();
const device = useDevice();
const appState = useExcalidrawAppState();
const appState = useUIAppState();
const setAppState = useExcalidrawSetAppState();
const onClickOutside = device.isMobile
? undefined